The Arcive of Official vBulletin Modifications Site.It is not a VB3 engine, just a parsed copy! |
|
#1
|
|||
|
|||
Css Image properties
as this is a more general question I thought I would post here.
Can any developers help me out on a small problem I am developing a small app to help with a game. Basicaly I have two images a main image that is of a large size sitting in a layer. A second image, which when a user clicks on the main images moves to that location. I have this working with a layer background image but I cant add hotspots. I would like to replicated this with have a div with an image. But I cant seem to find the attribute to move the image. Its hard to explain so I have producted a link to explain. http://www.dnd-gamer.com/index.php?p..._explorers_map thanks Gary Code:
<style type="text/css"> <!-- #Layer1 { width:675px; height:650px; z-index:1; background-image: url(./addons/dnl/map/images/mastermap3.jpg); background-position: -490px -2142px; background-repeat: no-repeat; } #mainimage { width:675px; height:650px; z-index:1; background-repeat: no-repeat; overflow:hidden; } --> </style> <script language="javascript"> var tempX = 0 var tempY = 0 function getMouseXY(e) { tempX = window.event.offsetX tempY = window.event.offsetY document.Show.MouseX.value = (tempX * -15) + 338 document.Show.MouseY.value = (tempY * -16.5) + 325 document.getElementById('mainmap').scrollLeft = tempX + 338 document.getElementById('mainmap').scrollTop = tempY + 325 document.getElementById('Layer1').style.backgroundPositionX = document.Show.MouseX.value document.getElementById('Layer1').style.backgroundPositionY = document.Show.MouseY.value } </script> <table> <tr><td>this is a layer div with a backgroundImage, by clicking on the smaller map, the backgroundPosition X and Y are set to move it around</td></tr> <tr> <td><div id="Layer1"></div></td> </tr> <tr><td>this is a div with a < img / > but what img.value do I need to set to move to the X/Y position</td></tr> <tr> <td><div id="mainimage"><img id="mainmap" src="./addons/dnl/map/images/mastermap3.jpg" /></img></div> </td> </tr> </table> |
|
|
X vBulletin 3.8.12 by vBS Debug Information | |
---|---|
|
|
More Information | |
Template Usage:
Phrase Groups Available:
|
Included Files:
Hooks Called:
|