Question

I’m using Drupal 7.0 and Galleria Javascript Image Gallery (fullscreen theme). And my theme got 2 navigation buttons. That’s css code:

.galleria-image-nav {
  height: 159px;
  opacity: 0.8;
  position: fixed;
  right: 0;
  top: 65%;
  width: 82px;
  z-index: 11000;
}

I want when browser get 960px, this nav buttons hide with fadeout effect. And my js code:

if ( $(".galleria-image-nav").length > 0 ) {
  if ( w_width < 960 ) {
    $(".galleria-image-nav").fadeOut(400);
  } else {
    $(".galleria-image-nav").fadeIn(400);
  }
}

But this function not working. Whats problem? Thanks. (and sorry my English.)

Answer 1

$(window).resize(function() {
  if ( $(".galleria-image-nav").length > 0 ) {
     if ( $(window).width() < 960 ) {
       $(".galleria-image-nav").fadeOut(400);
       }
     else {
       $(".galleria-image-nav").fadeIn(400);
       } 
     }
});​

Something like that should work