Tag: jquery masonry

jQuery Masonry没有使用jQuery选项卡

我在网站上有一个标签元素，在每个标签中都使用了jQuery Masonry脚本。 唯一的问题是Masonry网格只适用于第一个选项卡中的内容，但我需要它来处理每个选项卡中的内容。 我已经尝试为每个选项卡重命名容器，但似乎没有任何效果。 这是网站： http ： //joltentertainment.com/services-2/ 这是我的代码： Entertainment Ambiance & Décor Success A/V Rentals Emcees <img src="https://stackoverflow.com/questions/11749701/jquery-masonry-not-working-with-jquery-tabs//scripts/timthumb.php?src=http://joltentertainment.com/wp-content/gallery/the-worlds-best-prom/em1_2782_1.jpg&h=172&w=278&zc=1″ title=”” width=”278″ height=”172″ /> <img src="https://stackoverflow.com/questions/11749701/jquery-masonry-not-working-with-jquery-tabs//scripts/timthumb.php?src=http://joltentertainment.com/wp-content/gallery/the-worlds-best-prom/em1_2443_0.jpg&h=82&w=188&zc=1″ title=”” width=”188″ height=”82″ /> <img src="https://stackoverflow.com/questions/11749701/jquery-masonry-not-working-with-jquery-tabs//scripts/timthumb.php?src=http://joltentertainment.com/wp-content/gallery/the-worlds-best-prom/em1_2787_1.jpg&h=82&w=188&zc=1″ title=”” width=”188″ height=”82″ /> Great for all events, an Emcee can liven up events, help with announcements, encourage participants in team building or audience […]

jquery砌体，在div＃container的中心添加一个新的div

我的HTML中有一些DIV，我想点击一些div然后在div＃container的中心添加一个新的div。 并且页面可以reload ，将第一个div放在这个新的div周围。 但是，这就是我需要的 这是我的代码， http：//jsfiddle.net/PQGGT/ 还有一个window resizefunction。

在初始化之前不能调用砌体上的方法; 试图称’破坏’

因此，我试图将jQuery Masonry插件（来自： http ： //masonry.desandro.com/ ）与现代化器结合使用，以便在低分辨率下杀死砌体，以便我的div恢复到居中的局部宽度布局。 我承认我的javascript技能仍处于开发阶段，但我认为社区可能能够帮助我解决这个问题。 在低于768像素的分辨率下，我希望砌体在活动时被销毁，而在更大的分辨率下，如果尚未运行，我希望它能够被执行。 目前一切都工作正常，除了我在我的控制台中收到此错误： 无法在初始化之前调用砌体上的方法; 试图称之为’破坏’ 。 这是我处理此任务的代码。 $(window).load( function() { $(‘#masonry’).masonry({ transitionDuration: 10, columnWidth:’.sizer’, }); if(Modernizr.mq(‘screen and (max-width:767px)’) && $(‘#masonry’).masonry) { $(‘#masonry’).masonry(‘destroy’); } }); $(document).ready(function() { function doneResizing() { if(Modernizr.mq(‘screen and (min-width:768px)’)) { // action for screen widths including and above 768 pixels $(‘#masonry’).masonry({ transitionDuration: 10, columnWidth:’.sizer’, }); } […]

两列Masonry jQuery有不同的宽度？

我目前正在使用Masonry制作自定义主题。 我成功实现了砌体，但不幸的是，我无法弄清楚如何实现不同大小的两列。 要清楚地了解我正在尝试做什么，你可以看看图像： 我遇到的问题是我只能做出类似的宽度。 在我的例子中，我想要第一列（比如说）宽度= 250px，第二列是comlumn = 400px。 非常感谢您的帮助。

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

从左到右单击每个“更多”按钮（变为“更少”），单击第一行的最后一个图块的按钮时，图块不会正确重新组织，直到调整窗口大小（即使是一点点）。 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-” […]

砌体网格显示不正常

在这里，我试图让砌体网格到我的引导行值。 但是当我启动砌体网格时，我得到的网格在下面的行中的项目之间有很多空间。 我怎么解决这个？ 完整的HTML： .grid-item {width:400px;} Campingaz Expert Plus Gas Barbecue₹7995/-₹178000 of 4 owners reached Add to cart Milagrow Swimming Pool Robot : RoboPhelps₹29709/-₹1500000 of 8 owners reached Add to cart Stanley Socket Set₹0/-₹30 of 4 owners reached Add to cart Deemark Portable Home Spa Havvy Massager₹0/-₹31 of 4 owners reached Add to cart Yamaha […]

砌体不使用ajax和无限滚动

目前我正在使用AJAX从我们的Web服务中提取数据。 我遇到的问题是它不想将数据加载到砌体布局中， .social_block所有内容.social_block在下一个下面浮动一个（并且我没有为这些设置任何浮点数）。 所以砌体不起作用:( 我希望发生以下情况：在砌体布局中从webservice加载初始项目，在“无限”滚动中，它将使来自Web服务的分页请求将新项目附加到砌体布局中。 所以问题如下： – 为什么我的web服务项目没有使用砌体加载而只是加载到页面左侧？ – 如何使用我现有的AJAX请求使用无限滚动，以便使用我现有的分页代码将新数据输入到砌体布局中（首先请求加载http://example.com/自动，第二个请求加载http：第一次无限滚动时为//example.com/1 ,第二次无限滚动时第三次请求http://example.com/2 ，等等）？ 作为一个补充说明，如果我在行$container.imagesLoaded(function(){之前添加一个alert而不是console.log $container.imagesLoaded(function(){它似乎减慢了速度但是然后将初始请求加载到砌体格式 – 很奇怪！ ‘Load More! $(function(){ var $container = $(‘#container’); //alert(‘Masonry loads items in the nice layout if I do this’); $container.imagesLoaded(function(){ $container.masonry({ itemSelector: ‘.block’, columnWidth: 100 }); }); $container.infinitescroll({ navSelector : ‘#loadmore’, // selector for the paged navigation nextSelector : ‘#more’, […]

砌体插件垂直间隙

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

砌体不适用于Ember中的无限滚动

我正在尝试使用Jquery Masonry为我的图片库无限滚动。 砌体只适用于路线中的图像。 但是在将新图像对象推送到imagesarrays之后， 新图像出现在Dom但是砌体不起作用。 我见过Ember.js – jQuery-masonry +无限滚动并试过但我的代码仍无法正常工作。 图片库路线： App.ImggalleryRoute = Ember.Route.extend({ model: function(){ return { images: [ { name: “car”, src_path: “0dbf51ac84e23bd64d652f94a8cc7a22.png”, img_visible: true }, { name: “block”, src_path: “3b7bca99e44b3f07b4051ab70d260173.png”, img_visible: true }, … ] }; } }); imagegallery.hbs模板： {{#each img in images itemController=”galleryimage”}} {{#if img.img_visible}} {{/if}} {{/each}} 图库清单： App.ImggalleryView = Ember.View.extend({ templateName: […]

jQuery Masonry和CSS3

如何维护砌体布局但是当前图像涉及CSS3过渡？ inheritance人我的HTML $(function () { $(‘#container’).masonry({ columnWidth: 1, itemSelector: ‘div’ }); }); 和CSS html { height:100%; } body { width:900px; height:100%; margin:0 auto; margin-top:100px; background-image: url(images/gridbg.png); } #logo { } #container > div { margin: 5px; #imagetrans { position:relative; height:281px; width:450px; margin:0 auto; } #imagetrans img { position:absolute; left:0; -webkit-transition: opacity 1s ease-in-out; -moz-transition: opacity […]