Solved

CSS and Javascript

Posted on 2012-04-09
5
190 Views
Last Modified: 2012-06-21
I have been working on an issue that I can't seem to solve.  I am using javascript to replace a scrollbar.  It works fine, but if I use anchored navigation, it breaks the CSS.  Please go to:
http://www.redthesteakhouse.com/index.php/cleveland/index.php
then navigate to #Menu.  Use the scroll bar and then the navigation on the left and you will see what I mean.

I think it is a CSS issue but I'm not finding a solution.  Please help and thank you in advance!
0
Comment
Question by:rgranlund
  • 2
  • 2
5 Comments
 
LVL 21

Expert Comment

by:Kim Walker
ID: 37825632
I don't see anything happening to the CSS. The layout isn't changing when I use the navigation on the left. Please explain what's happening to the layout that you describe as "breaks the CSS."
0
 
LVL 7

Author Comment

by:rgranlund
ID: 37829690
If you use the nav on the left, the scrollbar moves up and out of view.
0
 
LVL 12

Expert Comment

by:Anuradha Goli
ID: 37831482
I find no scroll bar in chrome .
0
 
LVL 21

Accepted Solution

by:
Kim Walker earned 500 total points
ID: 37832261
The issue appears to be that the scroll bar is a child element of the div with class "jspContainer" which has scrolled up. The scroll bar is positioned absolutely at the top of it's parent div. The top of the parent div is out of view and thereby the scroll bar is out of view, too. Perhaps you should move the scroll bar up one level to be a child of the div with class "scroll-pane jspScrollable" instead.
0
 
LVL 7

Author Comment

by:rgranlund
ID: 37833763
@xmediaman  the JS for this is a large piece of Javascript that appends.  I would not be comfortable changing any of it since it is a large file.  Is there a simple piece of Javascript that can fix a div class vertically but not horizontally?
0

Featured Post

Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

Join & Write a Comment

Although it can be difficult to imagine, someday your child will have a career of his or her own. He or she will likely start a family, buy a home and start having their own children. So, while being a kid is still extremely important, it’s also …
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…
The viewer will learn how to count occurrences of each item in an array.

758 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now