Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Victor Enriquez
Victor Enriquez
22,766 Points

Passing a selector as an argument

I have this function but instead of writing $('.front img') , $('.bottom img') and so on I would like to pass that value as the argument of the next function

function revertHover(){
        $('.front img').css({"opacity" : 0.7,
                             "-webkit-transform" : "scale(1)",
                             "-moz-transform" : "scale(1)"});
        $('.PT').detach();
}

I have tried this but is not working :

function revertHover(face){
        $(face).css({"opacity" : 0.7,
                             "-webkit-transform" : "scale(1)",
                             "-moz-transform" : "scale(1)"});
        $('.PT').detach();
}

$('.front').hover(
    function(){
        $('.front img').css({"opacity" : 1,
                             "-webkit-transform" : "scale(2)",
                             "-moz-transform" : "scale(2)"});
        $('.popup').append("<p class='PT'>some stuff</p>).hide().fadeIn(800);
    }   
    ,revertHover(" '.front img' ") );

I am sure there is something pretty wrong, thanks a lot in advance for your help, I really appreciate!

2 Answers

You don't need the double quotes in

revertHover(" '.front img' ")

the following should work,

revertHover(".front img")

or

var side = $(".front img");
revertHover(side);
Victor Enriquez
Victor Enriquez
22,766 Points

Thanks for your answer, it helped me to solve the problem because that indeed was one mistake I had, the other one is that I found out I have to call the revertHover function within another function as the second handler in the hover method like this:

var frontSide = $(".front img");

function revertHover(side){
        side.css({"opacity" : 0.7,
                             "-webkit-transform" : "scale(1)",
                             "-moz-transform" : "scale(1)"});
        $('.PT').detach();
}

$('.front').hover(
    function(){
        $('.front img').css({"opacity" : 1,
                             "-webkit-transform" : "scale(2)",
                             "-moz-transform" : "scale(2)"});
        $('.popup').append("<p class='PT'>some stuff</p>).hide().fadeIn(800);
    }
//This is the other function I was talking about    
    ,function(){
        revertHover(frontSide);
    }
); 

Thanks again Kyle!

David Curtis
David Curtis
11,301 Points

i would suggest pasting your code into jsfiddle so we can see how it works together w/ the html etc. and then link your jsfiddle here.

sorry - meant to comment not post as an answer.