I was just wondering if somebody could give me a pointer on how to resolve this problem I am having. I have a scrolling layer that functions as the area for the main info of the site. The problem is when viewing the site in a resolution of 1024x768 or lower the rest of the page becomes long enough to force a scrollbar for the entire background. This creates extra scrolling when trying to scroll through the main info in the middle. So my question is, is there a way to disable the scrolling of the background while the viewer is scrolling through the info on the main layer?

Here is a link for an example:

http://www.sddrinkspecials.com/happyhour.htm

Thank you for any help!

<style type="text/css">

body {
overflow-x: hidden;
overflow-y: hidden;
}

</style>

I think that's the code.

Although if you use this code, viewers with 1024x768 screen resolution or lower would not be able to see the things on the bottom of your site. IMaybe would be better if you just made the graphics smaller.

Note that overflow-x & -y are Internet Explorer specific. For all browsers just use overflow:hidden

Though a better way is to design the page so 760px height is the maximum needed. That would eliminate the issue entirely. The 25% to 30% of users still on 800x600 will find scrolling pretty much the norm.
Though I would hazard a guess on the target audience for that site to be mainly using 1024x768 and above anyway so the percentage of 800x600 users would be lower.

BTW. Black text on that very busy background is no fun to read at any resolution.

hmm...I tried that code but it didn't seem to work guys? Any other ideas? Thank you for the help, I am still an amateur

Can we see your code?

Is this what you are looking for or do you want entire page?

body {
	background-image:  url(sddrnklayout.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	background-color: #000000;
	scrollbar-face-color:#94C0D6;
	scrollbar-highlight-color:#FFFFFF;
	scrollbar-3dlight-color:#447093;
	scrollbar-darkshadow-color:#447093;
	scrollbar-shadow-color:#FFFFFF;
	scrollbar-arrow-color:#000040;
	scrollbar-track-color:#447093;
	overflow: hidden;
}

Is what I am trying to do possible?

Yes, but you will need to adjust your design to a maximum height that your target audience demographic are most likely to be using.
I would guess that your design has been assembled at a high resolution (1600x1200 at least) and the graphics set to be seen at this.
If you look at the page in 1024x768 you see that just about everything could be reduced by 20 - 25% which should give a max height of around 720 px instead of the current ~980px.

Well, the site does need to be redone completely, but I was hoping for an easy fix just so people can scroll the div layer without causing the background to scroll with it as well. Thanks for the help guys!