javascript - Is it possible to merge these similar functions into one function? -
i have 3 (and more) functions each exact same thing, control different enumerated divs/variables depending on div mousewheel event triggered over. i'm curious if there tricks compact these similar dumb functions 1 smart function. each div needs own #bigwrappern , #wrappern, opacityn, , colorcountern.
$('#bigwrapper1').mousewheel(function(event, delta, deltax, deltay) { if (delta > 0) { opacity1 = opacity1 + .05; $('#wrapper1').css('background', "rgba("+colors[colorcounter1]+","+opacity1+")"); } else if (delta < 0) { opacity1 = opacity1 - .05; $('#wrapper1').css('background',"rgba("+colors[colorcounter1]+","+opacity1+")"); } }); $('#bigwrapper2').mousewheel(function(event, delta, deltax, deltay) { if (delta > 0) { opacity2 = opacity2 + .05; $('#wrapper2').css('background', "rgba("+colors[colorcounter2]+","+opacity2+")"); } else if (delta < 0) { opacity2 = opacity2 - .05; $('#wrapper2').css('background', "rgba("+colors[colorcounter2]+","+opacity2+")"); } }); $('#bigwrapper3').mousewheel(function(event, delta, deltax, deltay) { if (delta > 0) { opacity3 = opacity3 + .05; $('#wrapper3').css('background', "rgba("+colors[colorcounter3]+","+opacity3+")"); } else if (delta < 0) { opacity3 = opacity3 - .05; $('#wrapper3').css('background', "rgba("+colors[colorcounter3]+","+opacity3+")"); } });
use attribute starts selector. try:
$('div[id^=bigwrapper]').mousewheel(function(event, delta, deltax, deltay) { var = $(this).attr("id").split("bigwrapper")[1]; if (delta > 0) { opacity[i] = opacity[i] + .05; $('div[id="wrapper'+i+'"]').css('background', "rgba("+eval('colors[colorcounter'+i+']')+","+opacity[i]+")"); } else if (delta < 0) { opacity[i] = opacity[i] - .05; $('div[id="wrapper'+i+'"]').css('background', "rgba("+eval('colors[colorcounter'+i+']')+","+opacity[i]+")"); } });
Comments
Post a Comment