javascript - JQuery Slide in on Div.Show -
i'd preface fact very new javascript , jquery. have moderate amount of css , html knowledge however.
i have managed create set of div's shown in lots of four, , hide again on button clicks. javascript is:
function show() { $('div:hidden').slice(0, 4).show(); $('#hide').show(); } function hide() { $('.block').hide(); $('.block:lt(4)').show(); $('#hide').hide(); }
however next thing want, , herein lies question, make next 4 slide(down) in, instead of pop. have googled, , overflowed, binged! , unfortunately cant see way in way beginner javascript/query mind understands enough modify.
would appreciate help, tips, or nudges in right direction!
the answer in question. there jquery animation called slidedown(to show) , 1 slideup(to hide). see http://api.jquery.com/slidedown/
instead of show() , hide(), use slidedown() , slideup() , divs slide. this:
function show() { $('div:hidden').slice(0, 4).slidedown(); $('#hide').show(); } function hide() { $('.block:gt(3)').slideup(); $('#hide').slideup(); }
fiddle: https://jsfiddle.net/ydlgssnf/1/
Comments
Post a Comment