Question

我一直在为我的公司设计自由网页设计组合。哪个在s3 @ http://drootech.com.s3-website-us-west-1.amazonaws.com/dtindex.html

上是静态的

最初我一直在定制旧版本的砌体（使用jQuery / Javascript创建响应式投资组合），能够按类别（设计，工程等）过滤掉各种内容类型

它似乎工作正常，但我在控制台中收到错误“Uncaught ReferenceError：container is not defined”

以下是代码：

$(function (){
var columns = 3,
    setColumns = function() { columns = $( window ).width() > 640 ? 3 : $(window).width() > 320 ? 2 : 1; };

setColumns();
$(window).resize(setColumns);
    var $container = $('#portfoliocontainer');
    $container.imagesLoaded(function(){
      var msnry = new Masonry( container, {
        itemSelector : '.item',
    columnWidth:  function( containerWidth ) { return containerWidth / columns;
    }
      });
});

}）;

任何形式的帮助或亮点都会受到高度赞赏，我不知道为什么我会收到错误。

编辑我使用以下代码修复了错误。

// responsive masonry function
$(function msnry(){
var columns = 3,
setColumns = function() { columns = $( window ).width() > 640 ? 3 : $(window).width() >    320 ? 2 : 1; };
setColumns();
$(window).resize(setColumns);

    // layout Masonry again after all images have loaded
    var $container = $('#portfoliocontainer').masonry();
    var msnry;
    $container.imagesLoaded( function(){
    var container = document.querySelector('#portfoliocontent')
    msnry = new Masonry( container, {
    itemSelector : '.item',
    columnWidth:  function( containerWidth ) { return containerWidth / columns;}
      });
});
$('.expandi').click(function(){
    $('.expand').slideDown('fast');
    $(this).siblings('ul').toggle();
});
$('.engineeringiC').click(function(){
    if($('div.item').hasClass('designshwr')){
    masonry.hide(($this));
    $container.masonry('reloadItems');
}
});
});
    $("#seemore").click(function (){
        //$(this).animate(function(){
            $('html, body').animate({
                scrollTop: $("#mrkting").offset().top - 85
                 }, 2000);
        //});
    });
    $("#home").click(function (){
        //$(this).animate(function(){
            $('html, body').animate({
                scrollTop: $(".masthead").offset().top - 85
                 }, 2000);
        //});
    });
$("#info").click(function (){
        //$(this).animate(function(){
            $('html, body').animate({
                scrollTop: $("#mrkting").offset().top - 85
                 }, 2000);
        //});
    });
    $("#portfolio").click(function (){
        //$(this).animate(function(){
            $('html, body').animate({
                scrollTop: $("#portfolioo").offset().top - 85
                 }, 2000);
        //});
    });
    $("#menui").click(function (){
        //$(this).animate(function(){
            $('#navbar').addClass('slicknav');
            $('#navbar').slideDown('fast');
        //});
    });
    $("#socialmedia").click(function (){
            $("#myModal").modal('show');
    });
  $(window).scroll(function(){
  if ($(this).scrollTop() > 1080) {
  $('#contentnav').fadeIn('fast');
  $('#contentnav').addClass('dynamicnav');
}
if ($(this).scrollTop() > 400) {
   $('#navbar').slideUp('fast');
   $('#navbarm').slideDown('fast');
} if ($(this).scrollTop() < 1080) {
   $('#contentnav').removeClass('dynamicnav');
}

}）;

当您单击div engineeringiC时，我正在尝试使用上面的代码隐藏所有具有“designshwr”类的内容。

$('.engineeringiC').click(function(){
    if($('div.item').hasClass('designshwr')){
    masonry.hide(($this));
    $container.masonry('reloadItems');
}
});

但是我真的很难让它发挥作用。有什么想法或建议吗？附：忽略我需要重写的expandi函数。

Desandro的新砌体示例给出了“Uncaught ReferenceError：container is not defined”

0 个答案: