JasperTack
JasperTack

Reputation: 4447

html overflow issue

I already asked this question, but I didn't explain it too well, so I removed the thread. Now I have made an example in jsfiddle to show my problem: http://jsfiddle.net/6APjt/

I want a page with a header and below that a canvas. This canvas expands when I click on the zoom button. When this canvas expands there is an overflow that I want to be visible with scrolling. This is because I want the header of the page visible all the time, also when I scroll to the bottom of the canvas.

In the example you see that i have used a div with style overflow set to hidden (to prevent that when you scroll, the whole pages is scrolled). I tried to solve this by adding another div in this div with the property overflow set to scroll. This solves the vertical scroll, but I can't scroll horizontally.

Upvotes: 0

Views: 104

Answers (2)

Andrew
Andrew

Reputation: 1989

Your problem is in your javascript!

testcanavs.height *= 1.25;

There is a spelling error in there, change it to this and it will work

testcanvas.height *= 1.25;

EDIT: Try setting height, or max-height on your containing div. See this fiddle

Upvotes: 2

Enrique Moreno Tent
Enrique Moreno Tent

Reputation: 25267

Your div will grow since height: auto is the default. Set it manually.

Upvotes: 0

Related Questions