liamloveslearning Posted February 5, 2010 Share Posted February 5, 2010 Hey everyone, Has anybody an idea on how econsulting have done this with there logo, if you scroll down far enough you see it changes colour depending on the background, so it goes from transparent to solid, is this JavaScript or? Heres the culprit http://econsultancy.com/reports/search-engine-optimization-seo-best-practice-guide Link to comment https://forums.phpfreaks.com/topic/191071-how-to-change-image-depending-on-background/ Share on other sites More sharing options...
haku Posted February 6, 2010 Share Posted February 6, 2010 It's actually two different images, and they are using: background-attachment:fixed on each of the images. The way this CSS selector works is like having an element with a fixed position, but it's only visible when the element that it's placed inside is visible in that location. So at the top of that document, the image is in the head, so its visible. Then as you scroll, the head becomes non-visible (by scrolling up) and so the image disappears, but the second image becomes visible, because the section which it is in becomes visible in that spot. Link to comment https://forums.phpfreaks.com/topic/191071-how-to-change-image-depending-on-background/#findComment-1007700 Share on other sites More sharing options...
liamloveslearning Posted February 6, 2010 Author Share Posted February 6, 2010 brilliant haku, makes perfect sense! thanks Link to comment https://forums.phpfreaks.com/topic/191071-how-to-change-image-depending-on-background/#findComment-1008044 Share on other sites More sharing options...
lAZLf Posted February 9, 2010 Share Posted February 9, 2010 What haku said works incredibly (I implemented it on my own site). Also if you noticed, the image is a link, I would assume they just made a link with a set height and width with its position set to absolute and placed it over the background image. Link to comment https://forums.phpfreaks.com/topic/191071-how-to-change-image-depending-on-background/#findComment-1009210 Share on other sites More sharing options...
liamloveslearning Posted February 9, 2010 Author Share Posted February 9, 2010 love the effect lAZLf, it works well! Link to comment https://forums.phpfreaks.com/topic/191071-how-to-change-image-depending-on-background/#findComment-1009304 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.