PDA

View Full Version : iFrame Effect


Crumpy1
10-10-2012, 07:31 PM
Hi All,

I would like to create a website using the scrolling effect used on the link below

http://www.idiverseme.com/outer-nutrition/nourifusion-essentials.html

how does this work, is it an iframe?

I have tried looking at the code to see how this was done, however they have blocked all code viewing and right click features.

Thanks

gentleone
10-10-2012, 08:30 PM
I don't see any effect when scrolling in Chrome on Mac. What kind of effect should I see?

Crumpy1
10-10-2012, 09:41 PM
Sorry if my first post was unclear.
I want the page to scroll like the one in the website, the background never moves but the middle does, and the browsers scroll bars control the movement of the web pages content.

domedia
10-11-2012, 02:42 AM
Crumpy, did you look at the code of the site?

It will have something like this:
body {
background: url(bg.jpg) fixed;
}

This is the CSS shorthand way of doing it. The full CSS property is 'background-position'.

This is very basic CSS, and should provide as a great springboard for further learning :)


.

Crumpy1
10-11-2012, 09:11 AM
I have tried looking at the code to see how this was done, however they have blocked all code viewing and right click features.



Crumpy, did you look at the code of the site?

It will have something like this:
body {
background: url(bg.jpg) fixed;
}

This is the CSS shorthand way of doing it. The full CSS property is 'background-position'.

This is very basic CSS, and should provide as a great springboard for further learning :)


.

As mentioned above I did try to view the source code, however the code is locked for site integrity.

Thank you for providing the css to do it will i will try use the shorthand version of the rule you have provided, i assume their is no difference between that and the background position version.

Thank!

edbr
10-11-2012, 01:15 PM
if you use web developer tools you can see page source and css, they have just disabled right clicking

domedia
10-11-2012, 01:53 PM
As mentioned above I did try to view the source code, however the code is locked for site integrity. It's 'locked' for assumed site integrity. All it really does it reduce usability (and piss off users). Without the source, you can't view the web page, so it's on your computer already. Go to the browser menu bar and 'view source' there instead. Or just hit F12 for the developer tools in the browser.