javascript - compact jQuery script -
on site use jquery. keep code short , simple compress code litte. in jquery-code use following code:
$(".dienst1").hover(function() { $( ".toelichting1" ).stop().fadein(500); $( ".uitleg1" ).stop().fadeto( "fast", 0.9 ); $( ".uitleg2" ).stop().fadeto( "slow", 0.2 ); $( ".uitleg3" ).stop().fadeto( "slow", 0.2 ); $( ".uitleg4" ).stop().fadeto( "slow", 0.2 ); $( ".uitleg5" ).stop().fadeto( "slow", 0.2 ); $( ".uitleg6" ).stop().fadeto( "slow", 0.2 ); $(".readmore1").stop().show(); }, function() { $( ".toelichting1" ).stop().fadeout(10); $( ".uitleg2" ).stop().fadeto( "slow", 0.8 ); $( ".uitleg3" ).stop().fadeto( "slow", 0.8 ); $( ".uitleg4" ).stop().fadeto( "slow", 0.8 ); $( ".uitleg5" ).stop().fadeto( "slow", 0.8 ); $( ".uitleg6" ).stop().fadeto( "slow", 0.8 ); $(".readmore1").stop().hide(); }); $(".dienst2").hover(function() { $( ".toelichting2" ).stop().fadein(500); $( ".uitleg1" ).stop().fadeto( "fast", 0.9 ); $( ".uitleg2" ).stop().fadeto( "slow", 0.2 ); $( ".uitleg3" ).stop().fadeto( "slow", 0.2 ); $( ".uitleg4" ).stop().fadeto( "slow", 0.2 ); $( ".uitleg5" ).stop().fadeto( "slow", 0.2 ); $( ".uitleg6" ).stop().fadeto( "slow", 0.2 ); $(".readmore1").stop().show(); }, function() { $( ".toelichting2" ).stop().fadeout(10); $( ".uitleg2" ).stop().fadeto( "slow", 0.8 ); $( ".uitleg3" ).stop().fadeto( "slow", 0.8 ); $( ".uitleg4" ).stop().fadeto( "slow", 0.8 ); $( ".uitleg5" ).stop().fadeto( "slow", 0.8 ); $( ".uitleg6" ).stop().fadeto( "slow", 0.8 ); $(".readmore1").stop().hide(); }); i use code multiple times. possible make function of or there way keep away repeating code this?
you can use attribute starts selector [name^="value"]
in code can try:
$("div[class^='.dienst']").hover(function() { $("div[class^='.toelichting']").stop().fadein(500); $("div[class^='.uitleg']").stop().fadeto( "fast", 0.9 ); $(".readmore1").stop().show(); }); just change div html tag that's associated class.
i realised have different time values when fading, think last nested childs need different way it.
Comments
Post a Comment