Tag: 砌体

无法使用JQuery初始化Masonry

根据官方文档 ，有不同的方法来初始化砌体容器。 HTML初始化工作正常，但是当我尝试将参数从data-masonry属性移动到JQuery时，事情就会中断。 这是使用JSON参数的HTML初始化。 然后，当我将它们移动到我的js / JQuery文件时，这就是它当前的样子： var $container = $(‘#container’); // initialize $container.masonry({ columnWidth: ‘.grid-sizer’, itemSelector: ‘.item’, isFitWidth: true }); 使用后一版本，grid-sizer元素变得可见，当然不应该出现。 我在官方文档中没有看到关于何时需要在JQuery中调用初始化代码的规范。 是$（文件）.ready我可以称之为？ 布局破坏的JSFIDDLE： http ： //jsfiddle.net/1f1kwfbd/10/

砌体网格高度相同

尝试设置Masonry脚本以显示此页面上的图像： http ： //www.stefanheinrichs.com/projects/有可能吗？ 也许还有一些其他库会更好？ 提前感谢您的帮助

砌体重叠（Imbalance2 Bug）

我使用Wordpress.org构建了我的网站，主题称为Imbalance2。 我注意到这个主题有一个错误，我搜索了关于重叠问题的主题，因为Mason的js。 我使用imagesLoaded （来自用户Leger at using masonry with imagesloaded ，谢谢！）：它有效但有时我的Chrome仍然重叠。 我决定添加一个分页而不是“Lazy Load”（以避免更多问题…）但我无法合并#Loed的#Lowed和＃related … 请你帮助我好吗？ 这是我的网站地址 非常感谢您的时间！ $(document).ready(function() { // grid var $boxes = $(‘.box’); $boxes.hide(); var $container = $(‘#boxes’); $container.imagesLoaded( function() { $boxes.fadeIn(); $container.masonry({ itemSelector: ‘.box’, columnWidth: 290, gutterWidth: 40 }); }); $(‘#related’).masonry({ itemSelector: ‘.box’, columnWidth: 290, gutterWidth: 40 }).masonry(‘reload’); });

Masonry – Divs在每次页面加载时只能正确堆叠一次

我有一个使用Masonry库生成堆叠div的网站的问题。 当我刷新页面并单击页面上的单个选项卡时，我得到了正确的堆叠。 但是，在单击其他选项卡而不刷新页面后，我获取数据并使用各种div填充文档。 只有在我立即加载后单击选项卡时，才能正确完成堆叠。 单击一个或多个选项卡后单击另一个选项卡时，我看到堆叠不正确。 我被迫刷新页面，然后按一次选项卡以获得正确的结果。 我做错了什么，我该如何解决这个问题呢？ HTML Designers Viz Artists Production Artists 2D Artists Help Desk JS function FetchGroupJobs(WorkGroupID) { $.ajax({ url: url, data:data, success : function (json) { //First get users for (var key in json) { //Then loop through users to get jobs addGridToDiv(key); $(“#grid” + key).kendoGrid({ dataSource: { transport: { read: […]

砌体布局不能始终如一地调整

从左到右单击每个“更多”按钮（变为“更少”），单击第一行的最后一个图块的按钮时，图块不会正确重新组织，直到调整窗口大小（即使是一点点）。 initLayout：true和resize：true默认启用，但即使在toggle（）运行时再次显式设置它们也无法解决问题。 我在页面加载和toggle（）运行时初始化我的网格： jQuery(‘.grid’).masonry({itemSelector: ‘.tex-entry’}); 好到目前为止…… 底部瓷砖应位于下一行，不包括扩展内容。 但是在调整窗口大小时，网格会自行修正。 jQuery(document).ready(function () { //initialize the grid jQuery(‘.grid’).masonry({itemSelector: ‘.tex-entry’}); jQuery(“button.tex_overlay_button”).click(function () { var id = this.id; var toggle_num = parseInt(this.id.replace(“tex-toggle-“, “”), 10); jQuery(“#tex-hide-default-” + toggle_num).toggle(200); //reinitialize the grid when any toggle button is clicked – not working consistently until/unless window is resized. jQuery(‘.grid’).masonry({itemSelector: ‘.tex-entry’}); var content = jQuery(“button#tex-toggle-” […]

砌体插件垂直间隙

我试图在我的画廊添加类似pinterest的项目样式，但我的缩略图之间存在巨大差距。 在SO上发现了几个类似的问题，但遗憾的是，没有一个问题对我的情况有帮助。 脚本 $(‘#container’).masonry({ itemSelector: ‘.container’, columnWidth : 100 }); 画廊 … 款式 .item { width: 122px; margin: 5px; float: left; background-color: gray; } http://jsfiddle.net/D7QQU/44/ 提前致谢

jquery help – 在所有图像加载后初始化Masonry

我正在使用砌体插件，但是当页面首次加载时，我的图像会重叠。 如果我改变浏览器的宽度，它们就会落到位。 开发人员告诉我要执行以下操作，但我不确定如何“添加它：正确地添加到我的custom.js文件中。 我被告知： // with jQuery var $container = $(‘#container’); // initialize Masonry after all images have loaded $container.imagesLoaded(function(){ $container.masonry(); }); 谁能正确格式化这个建议，以便我可以使用它？

动态更新后自动在knockout绑定处理程序中应用masonry

我正在使用带有砌体的 knockoutjs并创建了一个自定义的敲除绑定处理程序，以将砌体应用于html元素。 我想要应用砌体的容器使用knockout的foreach绑定动态注入它的内容。 我遇到的问题是在砌筑容器动态更新后，自行应用砌体。 在代码段示例中，如果单击masonryize按钮，则会破坏砌体容器并重新应用mansonry，如何将此行为添加到我的绑定处理程序中？ ko.bindingHandlers.masonry = { update: function(element, valueAccessor) { var options = valueAccessor(); $(element).masonry(options); } } var vm = { term: ko.observable(), page: ko.observable(1), per_page: ko.observable(3), items: ko.observableArray(), masonryize: function() { $(‘.grid’).masonry(‘destroy’); $(‘.grid’).masonry({ itemSelector: ‘.item’, columnWidth: 200 }); }, getStuff: function() { $.ajax({ url: ‘https://api.github.com/search/repositories’, method: ‘GET’, data: { q: this.term, page: […]

当克服ajax加载更多按钮时，没有重新加载砌体物品

大家好，我有一个关于砌体项目的问题。 我从codepen.io创建了这个DEMO 在这个演示中你可以看到有这个javascript代码： $(window).load(function() { $( function() { var $container = $(‘.posts-holder’); $container.masonry({ isFitWidth: true, itemSelector: ‘.kesif-gonderi-alani’ }); }); }); 打开页面时，我只显示10个post。 如果用户想要显示其他10个post，则用户需要单击（显示更多按钮）。 我创建了这个ajax函数来显示更多post。 $(‘.showmore’).live(“click”,function(event) { event.preventDefault(); var ID = $(this).attr(“id”); var P_ID = $(this).attr(“rel”); var URL=$.base_url+’diger_fotograflar_ajax.php’; var dataString = “lastid=”+ ID+”&profile_id=”+P_ID; if(ID) { $.ajax({ type: “POST”, url: URL, data: dataString, cache: false, beforeSend: function(){ $(“#more”+ID).html(”); […]