Snugug / eq.js

Lightweight JavaScript powered element queries
http://eqjs.io/
MIT License
526 stars 34 forks source link

Not until browser resize #36

Closed lmartins closed 9 years ago

lmartins commented 9 years ago

Hi,

Im using eq.js and getting into an issue where the plugin won't run until I manually resize the browser window. Also worth mention that im using jspm to build my project. Not sure that can have any relation to this, although I do see the file eq.js being loaded in Network Activity.

Any tips on what to look for?

Snugug commented 9 years ago

My guess is that it's being loaded after DCL and Load events fire. My suggestion is to fire it on your own once you know it's loaded

lmartins commented 9 years ago

That works, thank you Sam.

lmartins commented 9 years ago

@Snugug sorry to bother you with this again, but I've been trying a few solutions for this but haven't found a reliable way to do it.

This might be due to the fact that i am building my project with JSPM, and loading EQ.js simply by requiring it require('eq.js');

Then, at the end of my JS, I have:

var DOMloaded_event = new Event('DOMContentLoaded');
document.addEventListener('DOMloaded_event', function(e){ console.log(e); });
document.dispatchEvent(DOMloaded_event);

This seems to be working ok locally, but on server it's causing weird issues with Wordpress customiser, which never renders a few pieces that rely on JS.

Could you help please?

Snugug commented 9 years ago

If your JavaScript isn't firing reliably, I'm not sure if I can help you with that. That sounds like a question better suited for StackOverflow. That being said, that JS does look funky; you're shouldn't be listening for DOMloaded_event, you should be listening for DOMContentLoaded. The name of your event variable !== the name of the event.

For the eq.js bit, what gets fired is simply eqjs.refreshNodes() followed by ejs.query(). Firing those two is essentially the same as firing the event. From the README:

Alternatively, you can use eqjs.refreshNodes() to update the listing of nodes that is use by eqjs.query() with all of the nodes currently in the DOM. This is useful when you know that a node has been dynamically added, but you don't have it as an object and can't pass it to ejs.query().

lmartins commented 9 years ago

Thank you Sam, your message was a great help as it helped me find where my code's issue was. And thank your for being polite about the "funky" code :) Damn, sometimes you miss the obvious details.

Snugug commented 9 years ago

:P welcome! Glad it helped you pin down your issue!