Home Upgrade Search Memberlist Extras Hacker Tools Award Goals Help Wiki Contact

[Blogger.com]help to needed to make image overlay

Demo : http://netstrikerz.blogspot.in/

I want to put the second picture ( special offer) exactly over the first mobile phone picture.
Can anyone help me to do this ?
Thanks
You could use "position: absolute". This style attribute makes an element position itself relative to the first parent with "position: relative" and outside of all other styling, above other elements.

Put bot pictures in a wrapper, make that "position: relative" and set "top: 0px" and "left: 0px" on the second image. If they have the same size they should now be on top of one another.

Hope this helps you solve your problem.

EDIT: Sorry, misunderstood you question....
(Jul 5, 2014 04:10 AM)cracker007 Wrote:  Demo : http://netstrikerz.blogspot.in/

I want to put the second picture ( special offer) exactly over the first mobile phone picture.
Can anyone help me to do this ?
Thanks

So these three images in single blog post right? then you can drag the second image to first position easily. If it not working Upload images from your blogger account instead of copying or delete all the images and copy one by one. This definitely helps you. 🤝
BTC : 1LjR87CZ5apfHkQG5MkkubbB8Hf7HUesqJ

[Image: 3QQXuOY.png]
(Jul 5, 2014 05:54 AM)JumpWar Wrote:  You could use "position: absolute". This style attribute makes an element position itself relative to the first parent with "position: relative" and outside of all other styling, above other elements.

Put bot pictures in a wrapper, make that "position: relative" and set "top: 0px" and "left: 0px" on the second image. If they have the same size they should now be on top of one another.

Hope this helps you solve your problem.

EDIT: Sorry, misunderstood you question....

Same happens to me, I don't understood your answer completely.

I want to put one image over another (ie: second image over the first image in above website)
(Jul 5, 2014 07:03 AM)cracker007 Wrote:  Same happens to me, I don't understood your answer completely.

I want to put one image over another (ie: second image over the first image in above website)

Have you tried what i said in above post??
BTC : 1LjR87CZ5apfHkQG5MkkubbB8Hf7HUesqJ

[Image: 3QQXuOY.png]
(Jul 5, 2014 06:01 AM)Naveen Wrote:  So these three images in single blog post right? then you can drag the second image to first position easily. If it not working Upload images from your blogger account instead of copying or delete all the images and copy one by one. This definitely helps you. 🤝

sorry i need to put Overlay image over image.(second one above first image ...keep third one as same.)
Do you mean completely covering the image so that when a user hovers over it the image underneath is shown? Or as a semitransparent overlay so you "see" both images just overlayed?

If you just want the first you would set the special offer as the main image and switch the image out on hover. (there are better more maintainable ways)

If you want the special offer image overlayed you can use :after and adjust the opacity.


Possibly Related Threads...
Thread / Author Replies Views Last Post
by Sir-TeabagAug 13, 2018 03:30 PM 3 97 Aug 13, 2018 03:30 PM
Last Post: Sir-Teabag
by imanobodyJan 2, 2018 10:55 AM 7 168 Jan 2, 2018 10:55 AM
Last Post: Pikzul
by BinaryCoreJul 14, 2017 07:24 AM 0 74 Jul 14, 2017 07:24 AM
Last Post: BinaryCore