How i can set the background image of image?
I have a image who's width and height i got in Javascript. i want to set the background image o开发者_如何学Gon image.
means to the background image is look like image as youtube show the image on video called play icon.
i want to show them on image. can someone tell me how i can set playicon over the image.
I didn't understand exactly your question. I suppose you want to place img over a background-image if yes check the following example:
html
<div>
<img id="play" src="http://dummyimage.com/40x40/454/000&text=Play">
<img id="pause" src="http://dummyimage.com/40x40/848/000&text=Pause">
</div>
css
div {background:url("http://dummyimage.com/300x300/000/fff&text=video") no-repeat;
height:300px;
width:300px;
position:relative;
}
img#play {
position:absolute;
bottom:0;
}
img#pause {
position:absolute;
bottom:0;
left:40px;
}
Demo: http://jsfiddle.net/ACazB/
div has position:relative and imgs inside div have position:absolute. This will allow you to manipulate the position of any images in the scope of div. Using box offsets top, bottom,left,right you can move the images in the place you need.
http://css-tricks.com/791-absolute-positioning-inside-relative-positioning/
http://www.w3.org/TR/CSS2/visuren.html#position-props
加载中,请稍侯......
精彩评论