Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 11-27-2012, 03:12 AM   PM User | #1
eydg
New Coder

 
Join Date: Sep 2012
Posts: 71
Thanks: 2
Thanked 1 Time in 1 Post
eydg is an unknown quantity at this point
scalable image AND its map

the following is a simple way to make background image scalable.

Code:
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#background
{
width:100%; height:100%; position: absolute; z-index: -1; top: 0; left:0;
}
</style>
<title>Untitled Document</title>
</head>

<body>
<img id="background" src="png_1.png"/>
</body>
</html>
how to do the same to the map of hotspots created for the image in, say, fireworks? Are there any better suited tools?

The purpose is being able to have an image scalable together with its responsive elements, with some html objects on top, also placed relatively to the scale of the image.

I wonder if that is possible at all or a different environment would be needed. any advise?
eydg is offline   Reply With Quote
Old 11-27-2012, 10:21 PM   PM User | #2
eydg
New Coder

 
Join Date: Sep 2012
Posts: 71
Thanks: 2
Thanked 1 Time in 1 Post
eydg is an unknown quantity at this point
200 views and no reply? maybe it is the wrong subforum?
eydg is offline   Reply With Quote
Old 11-28-2012, 12:02 AM   PM User | #3
DrDOS
Senior Coder

 
Join Date: Sep 2010
Posts: 1,153
Thanks: 10
Thanked 148 Times in 148 Posts
DrDOS is infamous around these parts
You're going to have to use either javascript or a server side language write the code for the map. It will need to 'know' the size of the image
and multiply the scale of the map accordingly.
DrDOS is offline   Reply With Quote
Old 11-28-2012, 01:22 AM   PM User | #4
eydg
New Coder

 
Join Date: Sep 2012
Posts: 71
Thanks: 2
Thanked 1 Time in 1 Post
eydg is an unknown quantity at this point
so it is possible? Great. JS is my option of choice.

Now it seems rather clear.
I guess I understand what you mean. The map coordinates will be variables derived with such a formula:

xnew=resolutionew*xold/resolutionold

Is this correct?
eydg is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 09:18 PM.


Advertisement
Log in to turn off these ads.