Skip to main content
added 66 characters in body
Source Link
Anjum
  • 974
  • 8
  • 13

the problem was in your variable define syntax and also you need to wrap your jQuery script into no conflict wrapper, try this

jQuery(window).load(function($) {
   // your function
});

or

(function($) {
  // your function
})(jQuery);

complete working script

(function($) {
   $(window).load(function() {
     var lightBox = $('#lightbox');
     var lightBoxContent = $('#lb-content');
     var positionLightbox = function() {
         var veiwWidth = $(window).width();
         var lbContentMargin = (veiwWidth / 2) - 148;
         var lbContent = $('#lb-content');
         lbContent.css({
           'left' : lbContentMargin,
           'top' : $(window).scrollTop() + 50 + 'px'
         });
     };

     $('.modal-trigger').click(function() {
         lightBox.fadeIn(function() {
         lightBoxContent.show();
     });
     positionLightbox();
     });
     $('#lb-close').click(function() {
         lightBox.hide();
         lightBoxContent.hide();
     });
   });
})(jQuery);

the problem was in your variable define syntax and also you need to wrap your jQuery script into no conflict wrapper, try this

(function($) {
   $(window).load(function() {
     var lightBox = $('#lightbox');
     var lightBoxContent = $('#lb-content');
     var positionLightbox = function() {
         var veiwWidth = $(window).width();
         var lbContentMargin = (veiwWidth / 2) - 148;
         var lbContent = $('#lb-content');
         lbContent.css({
           'left' : lbContentMargin,
           'top' : $(window).scrollTop() + 50 + 'px'
         });
     };

     $('.modal-trigger').click(function() {
         lightBox.fadeIn(function() {
         lightBoxContent.show();
     });
     positionLightbox();
     });
     $('#lb-close').click(function() {
         lightBox.hide();
         lightBoxContent.hide();
     });
   });
})(jQuery);

the problem was in your variable define syntax and also you need to wrap your jQuery script into no conflict wrapper, try this

jQuery(window).load(function($) {
   // your function
});

or

(function($) {
  // your function
})(jQuery);

complete working script

(function($) {
   $(window).load(function() {
     var lightBox = $('#lightbox');
     var lightBoxContent = $('#lb-content');
     var positionLightbox = function() {
         var veiwWidth = $(window).width();
         var lbContentMargin = (veiwWidth / 2) - 148;
         var lbContent = $('#lb-content');
         lbContent.css({
           'left' : lbContentMargin,
           'top' : $(window).scrollTop() + 50 + 'px'
         });
     };

     $('.modal-trigger').click(function() {
         lightBox.fadeIn(function() {
         lightBoxContent.show();
     });
     positionLightbox();
     });
     $('#lb-close').click(function() {
         lightBox.hide();
         lightBoxContent.hide();
     });
   });
})(jQuery);
added 66 characters in body
Source Link
Anjum
  • 974
  • 8
  • 13

i think the problem was in your variable define syntax and also you need to wrap your jQuery script into no conflict wrapper, try this

(function($) {
   $(window).load(function() {
     var lightBox = $('#lightbox');
     var lightBoxContent = $('#lb-content');
     var positionLightbox = function() {
         var veiwWidth = $(window).width();
         var lbContentMargin = (veiwWidth / 2) - 148;
         var lbContent = $('#lb-content');
         lbContent.css({
           'left' : lbContentMargin,
           'top' : $(window).scrollTop() + 50 + 'px'
         });
     };

     $('.modal-trigger').click(function() {
         lightBox.fadeIn(function() {
         lightBoxContent.show();
     });
     positionLightbox();
     });
     $('#lb-close').click(function() {
         lightBox.hide();
         lightBoxContent.hide();
     });
   });
})(jQuery);

i think the problem in your variable define syntax, try this

(function($) {
   $(window).load(function() {
     var lightBox = $('#lightbox');
     var lightBoxContent = $('#lb-content');
     var positionLightbox = function() {
         var veiwWidth = $(window).width();
         var lbContentMargin = (veiwWidth / 2) - 148;
         var lbContent = $('#lb-content');
         lbContent.css({
           'left' : lbContentMargin,
           'top' : $(window).scrollTop() + 50 + 'px'
         });
     };

     $('.modal-trigger').click(function() {
         lightBox.fadeIn(function() {
         lightBoxContent.show();
     });
     positionLightbox();
     });
     $('#lb-close').click(function() {
         lightBox.hide();
         lightBoxContent.hide();
     });
   });
})(jQuery);

the problem was in your variable define syntax and also you need to wrap your jQuery script into no conflict wrapper, try this

(function($) {
   $(window).load(function() {
     var lightBox = $('#lightbox');
     var lightBoxContent = $('#lb-content');
     var positionLightbox = function() {
         var veiwWidth = $(window).width();
         var lbContentMargin = (veiwWidth / 2) - 148;
         var lbContent = $('#lb-content');
         lbContent.css({
           'left' : lbContentMargin,
           'top' : $(window).scrollTop() + 50 + 'px'
         });
     };

     $('.modal-trigger').click(function() {
         lightBox.fadeIn(function() {
         lightBoxContent.show();
     });
     positionLightbox();
     });
     $('#lb-close').click(function() {
         lightBox.hide();
         lightBoxContent.hide();
     });
   });
})(jQuery);
added 107 characters in body
Source Link
Anjum
  • 974
  • 8
  • 13

i think the problem in your variable define syntax, try this

(function($) {
   $(window).load(function() {
     var lightBox = $('#lightbox');
     var lightBoxContent = $('#lb-content');
     var positionLightbox = function() {
         var veiwWidth = $(window).width();
         var lbContentMargin = (veiwWidth / 2) - 148;
         var lbContent = $('#lb-content');
         lbContent.css({
           'left' : lbContentMargin,
           'top' : $(window).scrollTop() + 50 + 'px'
         });
     };

     $('.modal-trigger').click(function() {
         lightBox.fadeIn(function() {
         lightBoxContent.show();
     });
     positionLightbox();
     });
     $('#lb-close').click(function() {
         lightBox.hide();
         lightBoxContent.hide();
     });
   });
})(jQuery);

i think the problem in your variable define syntax, try this

$(window).load(function(){
  var lightBox = $('#lightbox');
  var lightBoxContent = $('#lb-content');
  var positionLightbox = function() {
      var veiwWidth = $(window).width();
      var lbContentMargin = (veiwWidth / 2) - 148;
      var lbContent = $('#lb-content');
      lbContent.css({
        'left' : lbContentMargin,
        'top' : $(window).scrollTop() + 50 + 'px'
      });
  };

  $('.modal-trigger').click(function() {
      lightBox.fadeIn(function() {
      lightBoxContent.show();
  });
  positionLightbox();
  });
  $('#lb-close').click(function() {
      lightBox.hide();
      lightBoxContent.hide();
  });
});

i think the problem in your variable define syntax, try this

(function($) {
   $(window).load(function() {
     var lightBox = $('#lightbox');
     var lightBoxContent = $('#lb-content');
     var positionLightbox = function() {
         var veiwWidth = $(window).width();
         var lbContentMargin = (veiwWidth / 2) - 148;
         var lbContent = $('#lb-content');
         lbContent.css({
           'left' : lbContentMargin,
           'top' : $(window).scrollTop() + 50 + 'px'
         });
     };

     $('.modal-trigger').click(function() {
         lightBox.fadeIn(function() {
         lightBoxContent.show();
     });
     positionLightbox();
     });
     $('#lb-close').click(function() {
         lightBox.hide();
         lightBoxContent.hide();
     });
   });
})(jQuery);
added 4 characters in body
Source Link
Anjum
  • 974
  • 8
  • 13
Loading
Source Link
Anjum
  • 974
  • 8
  • 13
Loading