How to insert css rule into javascript? -
animation: scaleup 0.3s linear 0.4s forwards; animation: scaledown 0.3s linear forwards; hi, i'm trying animate contents when filter contents. i'm trying add these 2 css rules above javascript code below when 'hide elements don't share our class' , when 'show elements share ourclass' don't know how open , close tags because don't know javascript. if me appreciate it. thanks.
$(document).ready(function() { $('#filteroptions li a').click(function() { // fetch class of clicked item var ourclass = $(this).attr('class'); // reset active class on buttons $('#filteroptions li').removeclass('active'); // update active state on our clicked button $(this).parent().addclass('active'); if(ourclass == 'all') { // show our items $('#ourholder').children('div.item').show(); } else { // hide elements don't share ourclass $('#ourholder').children('div:not(.' + ourclass + ')').hide(); // show elements share ourclass $('#ourholder').children('div.' + ourclass).show(); } return false; }); });
unless missing something, see no reason why following won't work:
$("#ourholder").css("animation","scaleup 0.3s linear 0.4s forwards"); or
$("#ourholder").css({"animation" : "scaleup 0.3s linear 0.4s forwards"}); it better practice add css class , toggle classes instead.
just note, not sure selector want, chose #ourholder example.
Comments
Post a Comment