CSS for my ZoomHandlers as shown
I have a CSS for my ZoomHandlers as shown
.zoomHandle { width: 10px; height: 55px; }
Please see the Image of the Zoomhandlers on the chart here http://www.tiikoni.com/tis/view/?id=74ce68f
What i want to have is that , Left and Right Arrow marks on the Left and Right Zoom handlers on it , as shown here
http://www.tiikoni.com/tis/view/?i开发者_JAVA技巧d=bab7819
I have tried adding background-image:("Test.png"); , but it did not got shown
Any ideas ??
Here is the solution. Css Sprites
You ask How?In the tutorial you see how you can display a part of a large image that you tell it zoom
<ul id="container">
<li id="image"></li>
</ul>
<style type="text/css">
#container{
position:relative;
width:400px;
height:200px;
background-image:url("background.jpg");
overflow:hidden;
}
#image{
position:relative;
width:1024px;
height:200px;
left:-100;
}
</style>
and you can have two button and with jquery increase or decrease left position of #image
精彩评论