jquery - Getting a fixed footer to expand height from top to bottom on scroll -


i have page - here fixed footer. main content #mid.stages > .stages scrolls behind footer, , using jquery waypoints when scroll bottom of page footer needs gain height (from top down) , section #topfooter needs expand top down reveal contents. have been trying various solutions no avail, namely due fact when loaded footer has fixed position , 'reveal' part of outside browser window.

    $(function(){         var position = function () {             var w = $(window).height();             //var f = $('footer').height();             var foo = (w-110);             console.log(foo);             $('footer').css('top', foo);         };         $(document).ready(position);         $(window).resize(position);          $('#mid').waypoint(function(direction) {             var stagepos = $('.stage').position();             if (direction === 'down') {                 //$('footer').animate({height:'600px', top:'stagepos.top'},300,'swing', position);                 $('footer').css({'position':'absolute', 'height':'600px','top':'stagepos.top'});                 $('.tfcontent').css({'height':'200px'});                 $('p.extra').fadein('fast');             } else if (direction === 'up') {                 $('footer').css({'position':'fixed','top':'foo'});                 $('.tfcontent').css({'height':'60px'});                 $('p.extra').slideup('fast');             }             position();         }, { offset: 'bottom-in-view' });     });

i need footer expand top down, doesn't cover content in #mid.stages > .stages, pretty opposite of have now, , able use sort of animation it's not choppy now. push in right direction appreciated.

i noticed referring variables in between quotes. need remove quotes. in following lines:

$('footer').css({'position':'absolute', 'height':'600px','top':stagepos.top});

in line don't see variable foo, 1 see defined inside position function. unless have somewhere else in code, need replace calculation:

$('footer').css({'position':'fixed','top':$(window).height()-110});

also, noticed set top of footer top of first stage element , that's why grows upwards , covers content. suggest trying make footer position relative, height of 60px , animate growth 600px. stay below content , page grow contain it.

$('footer').css({'position':'relative', 'height':'60px'}).animate({'height':'600px'}, 400) ;

Comments

Post a Comment

Popular posts from this blog

linux - xterm copying to CLIPBOARD using copy-selection causes automatic updating of CLIPBOARD upon mouse selection -

i've tried various ways coerce xterm (versions 285 , 292) copy selection clipboard clipboard whenever press ctrl-shift-c. promising way far has been, in ~/.xresources, put this: xterm*vt100.translations: #override \ ctrl shift <keypress> c: copy-selection(clipboard) \n\ ctrl shift <keypress> v: insert-selection(clipboard) ctrl-shift-v works perfectly, copying has nuance... if restart xterm, highlighting text puts things in primary clipboard; expected, proper, default behavior. if hit ctrl-shift-c, copies current selection clipboard clipboard. the bug, however, if highlight text after first time pressed ctrl-shift-c, you'll see highlighting copies both primary and clipboard. cannot figure out how stop xterm updating clipboard upon selection... , doesn't make sense me in first place. i said, @ specific point in time, copy selection clipboard... yet starts updating automatically upon selection after doing once... anyone have workaround...
Read more

c++ - qgraphicsview horizontal scrolling always has a vertical delta -

Image
i've subclassed qgraphicsview custom canvas used in cad application. i've reimplemented qgraphicsview::wheelevent check keyboard modifiers control key and, if control key pressed, zoom. i'm trying implement horizontal scroll when user holds shift , uses wheel. the problem i'm having horizontal scrolling always scrolls 0.279. not huge problem, hugely annoying , points else being wrong. so, here questions: is right way implement horizontal scrolling? if not, is? how eliminate delta of 0.279? thanks in advance. code , sample output below void myview::zoom(int delta) { double factor = pow(1.2, delta/abs(delta)); this->scale(factor, factor); } void myview::scrollhorizontal(int level) { qpointf center = maptoscene(viewport()->rect().center()); qdebug() << "center: " << center.x() << ", " << center.y(); centeron(qpointf(center.x() - level, center.y())); } void myview::wheelevent(qwheeleve...
Read more