My webpage doesnt scroll down - html

I want to scroll over the page, but currently my website doesn't have a scroll bar and I already tried "overflow: scroll;" which is not included by original code but doesn't fixed anyway. I'm unable to get the rest of the page to scroll as it should. What is the other solution or how can I add scroll option on my webpage?
Any help is most welcome and much appreciated.
http://collabedit.com/xdyw2

You need to change position fixed in your class of static to something else.

Related

How to do the whole div scroll on scroll event?

So, the question is pretty basic but I couldn't find an example snippet to start with.
Idea is to have multiple div with full-screen height and upon scroll, the whole of the div scrolls making the user think that they are on same position and content is coming on same position. [ kinda-ish]
I have an example website where such scrolling behaviour is done. here
Just a reference will help me start.
Thanks

Div not scrolling can only use scrollbar

Hello I am trying to make a div scrollable with mouse wheel but its only working with the scroll bar right now the page is http://154.16.127.140/agar/indexBETA.html Please help me ! Ps its the Server Selection div with all the servers and the blue scroll bar.
Here there is an easy example: DIV with wheel scrollable content
If you can't apply let me know I will try to add it in your page.
I try my own suggestion on your page and does not work. Probably as you have many JS some doesn't work together. I try with a page without other JS and it works.

Background Wing Sections Fixed after Scroll

I’m working on this website for a client: http://alsite2.stackinjb.com.au/. They want to add ‘skins’ or 'wings' to some pages, as you can see here: https://www.jbhifi.com.au/
If you look at the JB Hi Fi website, you’ll notice that when you scroll down, the top of the ad fixes to the top of the screen. On my site, I can’t seem to make this work.
Any help on how to make this work would be much appreciated.
Cheers
You need some javascript for this. Every time the page is scrolling, you have to check the scroll position against the position of the sticky element. If the scroll position bigger than the position of the sticky element, make it sticky.
Check out Waypoints, this is a nice library for such things.

Scroll bar issue in CSS

I'm currently making a new website for my school and some of my webpages have more content than others and they require scroll bars and when you open these pages, the content moves with a few mm to the left which is really annoying and I can't leave it like that.
Some people advice me to target the html tag and use the overflow-y:scroll property but that way the pages with a few lines of text get a unusable scroll bar - it just looks unprofessional... Is there another option to bypass that issue? I'll be grateful if you can answer me :)
overflow-y: auto;
Causes the scroll bar to be visible when it is needed. Otherwise it will stay hidden. Try and see if it works.

hidden area - scroll not displaying

Hey Guys I have implemented a scroll area but within the scroll the I have an expandable text area but the scroll area doesn't take this in to consideration so when the expandable text is clicked it is cutting of the bottom. Is there anyway to fix this? The link that its doing it on is http://www.ashleysark.com/transport
You can see on http://www.ashleysark.com/dogcare the scroll works.
Thanks
Adam
When the page was loaded the height of the content was small and when the vets link was clicked thn the height increased and now the javascript is not aware of it may be one simple fix will be once the accordion call is done try calling $("#scrollbar1").tinyscrollbar() that should fix the issue.
You have to call $("#scrollbar1").tinyscrollbar() again after the text has expanded. In fact, you have to call it every time the content of <div id="scrollbar1"> changes.