More efficient switch statement in jQuery/JavaScript -


i'm working on app uses switch statement provide custom animations depending on link has been clicked trigger animation. seems lot of code want, i'm having little trouble figuring out better way it.

what happens when click on link, div open reveal hidden content , other divs slide side of screen. kinda custom accordian.

my switch statement looks - history paramater taken id of clicked link. divs stored in object called rpsobject.

switch( history ) {     case "biography" :         $("#" + rpsobject.boxid[1]).myanimation();         $("#" + rpsobject.boxid[2]).myanimation({ top : 80 });         $("#" + rpsobject.boxid[3]).myanimation({ top: 160 });         $("#" + rpsobject.boxid[4]).myanimation({ top: 240 });         $("#" + rpsobject.boxid[5]).fadeincloselink();     break;     case "blog" :         $("#" + rpsobject.boxid[0]).myanimation();         $("#" + rpsobject.boxid[2]).myanimation({ top : 80 });         $("#" + rpsobject.boxid[3]).myanimation({ top: 160 });         $("#" + rpsobject.boxid[4]).myanimation({ top: 240 });         $("#" + rpsobject.boxid[5]).fadeincloselink();     break;     case "diary" :         $("#" + rpsobject.boxid[0]).myanimation();         $("#" + rpsobject.boxid[1]).myanimation({ top : 80 });         $("#" + rpsobject.boxid[3]).myanimation({ top: 160 });         $("#" + rpsobject.boxid[4]).myanimation({ top: 240 });         $("#" + rpsobject.boxid[5]).fadeincloselink();     break;     case "reviews" :         $("#" + rpsobject.boxid[0]).myanimation();         $("#" + rpsobject.boxid[1]).myanimation({ top : 80 });         $("#" + rpsobject.boxid[2]).myanimation({ top: 160 });         $("#" + rpsobject.boxid[4]).myanimation({ top: 240 });         $("#" + rpsobject.boxid[5]).fadeincloselink();     break;     case "images" :         $("#" + rpsobject.boxid[0]).myanimation();         $("#" + rpsobject.boxid[1]).myanimation({ top : 80 });         $("#" + rpsobject.boxid[2]).myanimation({ top: 160 });         $("#" + rpsobject.boxid[3]).myanimation({ top: 240 });         $("#" + rpsobject.boxid[5]).fadeincloselink();     break;     case "contact" :         $("#" + rpsobject.boxid[0]).myanimation();         $("#" + rpsobject.boxid[1]).myanimation({ top : 80 });         $("#" + rpsobject.boxid[2]).myanimation({ top: 160 });         $("#" + rpsobject.boxid[3]).myanimation({ top: 240 });         $("#" + rpsobject.boxid[4]).fadeincloselink();     break; } 

hopefully should pretty obvious i'm doing here!

the functions myanimation() , fadeincloselink() custom functions. latter must performed on last item of object, on complete trigger custom animation selected div. function fadeincloselink() following:

$.fn.fadeincloselink = function() {     $(this).animate({ "left" : "640px", "top" : "320px", "height" : "80px" }, 300,     function(){         disfull.animate({ "opacity" : "toggle", "height" : "toggle" }, 500);     }); } 

where disfull refers div affected.

hopefully clear enough question across.

here came quickly

var historyitems = "biography,blog,diary,reviews,images,contact".split(",") var currentsettings = []; (var i=0;i< historyitems.length; i++) {   if (historyitems[i] != history) currentsettings.push(i) }   $("#" + rpsobject.boxid[currentsettings[0]]).myanimation(); $("#" + rpsobject.boxid[currentsettings[1]]).myanimation({ top : 80 }); $("#" + rpsobject.boxid[currentsettings[2]]).myanimation({ top: 160 }); $("#" + rpsobject.boxid[currentsettings[3]]).myanimation({ top: 240 }); $("#" + rpsobject.boxid[currentsettings[4]]).fadeincloselink(); 

Comments

Popular posts from this blog

c# - SharpSVN - How to get the previous revision? -

c++ - Is it possible to compile a VST on linux? -

url - Querystring manipulation of email Address in PHP -