Javascript Q & Eh...
- Started
- Last post
- 11 Responses
- ideaist
Greeting from the North...
Working on a new site for my girl & I and trying to solve a javascript issues.
I have a div that is 100% height with a div inside set to overflow-y: auto; (so scrollbars are automatic on smaller monitors/mobile).
LIVE EXAMPLE -> http://coloveration.com/ii/harve…
However, I have a menu of 120px sitting at the bottom at all times. So I need to take the 100% height element and subtract 120px from it; I guess this would change as well on window resize?
Possible?
Simple?
Answers, both relevant & irrelevant (as always) are appreciated; I'm fairly new to javascript...
- ernexbcn0
It's easy with jQuery, you need to create a function that gets called on DOM ready to position that menu where you want to (you'll need to position it measuring it's dimensions and subtracting that to the browser viewport dimension). The same function needs to get called on browser resize.
- ernexbcn0
It's easy with jQuery, you need to create a function that gets called on DOM ready to position that menu where you want to (you'll need to position it measuring it's dimensions and subtracting that to the browser viewport dimension). The same function needs to get called on browser resize.
- ernexbcn0
Damn, double post'd.
- ernexbcn0
Here you go:
I'm offsetting the red box 30 pixels from bottom and 30 pixels from the right of the window in the example.
- Hope this helps.ernexbcn
- It should work okay with % rather than a px amount for the initial div?ideaist
- you can measure the element with jQuery, you can get the actual pixels it measuresernexbcn
- even if it's being declared as %, you can get the actual pixels it measures as rendered by browserernexbcn
- Excellent...ideaist
- Give me 5-10 to implement and commence kissing of ass homey...ideaist
- While you're at it... Any neater, more scalable way of doing what I did in this:
http://jsfiddle.net/…orrinward2 - Wicked; the power of javascript/jquery still baffles me...ideaist
- ernexbcn0
$(window).height(); and $(window).width(); are the viewport dimensions, the size of the client's browser window.
You can get dimensions for any element passing a selector, like:
$("#something div.box").height(); etc.
- ideaist0
http://coloveration.com/ii/harve… *REFRESH*
Well on it's way bud; thank you so much! May you and yours enjoy an exceptional holiday season as a result of this kind act towards your fellow man!
: )
I'll fire up a link when I have it at 100%!
- ernexbcn0
@ideaist I think you to push it a bit more up, I can't read all the text on it, read until here:
"framed Coloured Pencil, Acrylic Paint & Ink on" <
- ernexbcn0
@orrinward2 this is what I came up with: http://jsfiddle.net/Btxz8/
- ideaist0
emexbcn,
you'll be very pleases to see the following:
http://coloveration.com/ii/art/
Double sides of using your coding advice and also using a central element that resizes dynamically...
; )