treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] Small JS bump needed

  • Hey all,

    fiddled for several hours now but can't find a solution to this simple thing.

    I got a fullscreen image that is put in by backstretch.js. The preloader for this image is this:

      jQuery(function($){
        $(window).on("backstretch.show", function () {
          $("#preload").fadeOut('slow');
        });
      });
    

    works fine.

    On another page i have an image stretched into a div with id="letterbox" by backstretch.

    if i change (window) to ("#letterbox") it does not work. Isn't this the right approach?

    I'll never get JS :(.

  • i dont think that you can use the .on event here. if you go to there homepage there is a section for using on block level elements. here is that code

    $("#letterbox").backstretch("path to your image");
    
  • Yes and that's working quite well. I only need my preloader set so he knows when the image is isloaded inside the div.

    the backstretch itself is perfectly okay..

  • Okay sorry. didnt read the question that well. can you post some screenshots or a codepen so i can se what the exact problem is? :)

  • yeah sure. I've put it up: Tingeltangel

    you see? the preloader image won't fade. :(

    I think it's only a small thing somehow...

  • the only thing i could see was an extra . infront of backstretch. it sould be

    $(window).on("backstretch.show"
    

    as it is now you are listening for the wrong event. hope that helped. i have no way to test if that's working, but let me know.

  • That's it. I'm embarrassed. Thank you, Carl!