jquery-masonry

问题 RequireJS newbie here. Trying to convert some JQuery code I had working fine in the old way to work w/ RequireJS. Header of my page loads three JS files via script tags -- require.js itself, my require.cfg.js, and boot/main.js with the site-specific functionality. Relevant require.cfg.js excerpt: ,paths: { 'boot': 'src/boot' ,'jquery': 'lib/jquery.min' ,'jquery.masonry': 'lib/plugins/masonry.pkgd.min' ,'jquery.imagesloaded': 'lib/plugins/imagesloaded.pkgd.min' } ,shim: { 'jquery': { exports:

问题 I've been using JQuery masonry and now I'm adding infinite scroll. There are images in nearly every masonry "brick" and before I was using infinite scroll the images loaded fine and everything was great. I added the next part of the javascript for the infinite scroll and added the imagesLoaded method inside but when the new bricks are appended they come out all piled on top. My assumption is that I am not adding the imagesLoaded method properly in the infinite scroll callback but I haven't

问题 Can anyone suggest how this site uses the jQuery Masonry plugin for its responsive, fluid layout? http://tympanus.net/codrops/collective/collective-2/ Specifically; The number of columns changes from 3 to 2 to 1 on browser resize which is what you expect from a site using masonry, but what's interesting is the columns also resize to always fill the full width available. Most other Masonry sites I've seen leave gaps to the right of the columns as the number of columns changes (e.g http:/

问题 I have a series of clickable boxes. I need to be able to expand the boxes and hide its img. I also need to be able to close previous opened one taking it back to its original height and defined width while fading back in its img. .info loads ajax content <div class="box"> <img src="#" /> <div class="info"></div> </div> <div class="box"> <img src="#" /> <div class="info">Ajax load content</div> </div> <div class="box"> <img src="#" /> <div class="info">Ajax loads content</div> </div> The css,

问题 I have a dropdown (ul.sub-menu) with items inside (ul.sub-menu > li) that I'd like to apply jQuery Masonry to, but my dropdown is absolutely positioned. Is there a way to do this and keep my absolute positioning on the parent element? Javascript jQuery("ul > li > ul.sub-menu").masonry({ itemSelector: '.brick', columnWidth: 300 }); HTML <ul> <li id="menu-item-9451" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-9451"><a href="/solutions/" >Solutions</a> <ul class=

问题 jQuery UI Sortable is not working when using Masonry. Any idea how to avoid this conflict? Any help would be appreciated. 回答1: I think i had a similar problem. I managed to fix it by simply recalling masonry within the code for setting up the sortable elements. (there might be a better way, i'm not sure?) $(function() { $("#youritem").sortable({ opacity: 0.9, cursor: 'move', update: function() { var order = $(this).sortable("serialize") + '&action=updateRecordsListings'; $.post("dosomething

问题 jQuery UI Sortable is not working when using Masonry. Any idea how to avoid this conflict? Any help would be appreciated. 回答1: I think i had a similar problem. I managed to fix it by simply recalling masonry within the code for setting up the sortable elements. (there might be a better way, i'm not sure?) $(function() { $("#youritem").sortable({ opacity: 0.9, cursor: 'move', update: function() { var order = $(this).sortable("serialize") + '&action=updateRecordsListings'; $.post("dosomething

问题 I'm getting a strange bug in the browsers in iOS7 where black lines are appearing around div elements. But when you zoom in to an element, these lines are disappearing. Does anyone have an idea what causes this strange bug? In iOS6 there weren't any lines appearing. It's happening on this url: http://www.tristanfrencken.com/ Hopefully someone could help me with this! 回答1: Bizarrely, this seems to be triggered when an element is fixed AND has a background color, but only in IOS7 and not if it

问题 Does anyone know how to make jQuery masonry stack from the bottom up? I wrote some rudimentary JS to stack things from bottom up but it couldn't do masonryish stuff like stacking the next brick on the shortest column and bricks that span multiple columns. Since I'm not good with Math, looking at the source code just makes me dizzy. Anyone want to try? 回答1: You're going to laugh at how easy this is to do, but you will need to modify the plugin (demo). Basically, I changed line 82 - 85 from

问题 It seems that when I try to load the page, all the images are stacked on top of one another. But if you were to click a link which takes you to the same page (like the home link) then masonry kicks in. So I think masonry is loading too early, like before jquery readies the page or something. Here my jquery call: $(document).ready(function(){ $('#image_roll_container').masonry({ itemSelector: '.box' }); .... Here's the page in question: http://ratattoos.com/ it works just fine in firefox and