0

Having an issue with the jquery .hover function. I am only able to get it to work if I wrap it in a generic $(function(){ I have seen it done without needing this generic function, if anyone can see what i am doing wrong I would appreciate it.

This does not Work:

$('#slider > img').hover(function () {
    stopLoop();
}, function () {
    startSlider();
});

This does work:

$(function () {
    $('#slider > img').hover(function () {
        stopLoop();
    }, function () {
        startSlider();
    });
});
6
  • That isn't a generic function, it's shorthand for document.ready. Commented Mar 10, 2014 at 17:33
  • That's not wrapping it in a generic function. That's tying it to the document being ready (which is what you want to do). Keep doing it the second way. Commented Mar 10, 2014 at 17:33
  • Probably when you retrieve $('#slider > img') that element/s is/are not yet on the DOM Commented Mar 10, 2014 at 17:33
  • What the others said, document ready and all, as a sidenote you could do .... Commented Mar 10, 2014 at 17:34
  • 3
    $('#slider > img').hover(stopLoop, startSlider); Commented Mar 10, 2014 at 17:34

1 Answer 1

2

Simple answer is You are trying to bind the events to tags while they are not exists in the dom. So Make it in $(document).ready() or $(function()

$(document).ready(function() {
    $('#slider > img').hover(function () {
        stopLoop();
    }, function () {
        startSlider();
    });
});
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.