ned help positioning dor on an image (location of product)

[DougP]

I have this code which positions the bullet image on the underlying blueprint.

But I would like to pass the X-Y cords to the page some how, so when it is loaded it shows the bullet where it is each time. How do I make the 400 and 500 be variables in HTML is that possible?

Or if there is another way Great. Also this method changes the position of the bullet depending on which device it running on, so this is not the best way anyway.

<asp:Panel ID="Panel1" runat="server" Height="16px" Width="800px">
        <asp:Label ID="lblLocation" runat="server" BackColor="Red" BorderColor="Maroon" Text=" * "></asp:Label>
        <img alt="" class="auto-style1" src="Images/Blueprint.jpg" />
        <img src="images/BulletRed.png" style="position:absolute; top:[highlight #FCE94F]400[/highlight]px; left:[highlight #FCE94F]500p[/highlight]x;"/>
    </asp:Panel>

DougP

 

[ChrisHirst]

This is a HTML & CSS 'issue' NOT a server side code one.

400 and 500 be variables in HTML is that possible?

No,

A: Because they are CSS property valuess

B: HTML doesn't have 'variables'

Or if there is another way Great. Also this method changes the position of the bullet depending on which device it running on, so this is not the best way anyway.

Read up on "Media Queries"

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum

 

[jbenson001]

The only way to make those values variables would be to use javascript. Personally, I would use JQuery. With JQuery(or js), you can easily detect the screen size and orientation, and set the values as needed.

 

[DougP]

So jbenson001, I can embed that in my ASP.net? or?
I will start a new thread over there.


DougP

 

[jbenson001]

You would have to write a script, let's say using JQuery, that is run on the DOM load. It can determine the size of the screen. In there you can place logic based on dimensions on where to place the image. You can set CSS attributes easily from JQuery.

 

[jbenson001]

You can look at the JQuery API documentation. Here is a quick example of what I was talking about above:

http://stackoverflow.com/questions/2597152/jquery-window-resize-doesnt-work-on-load