Cant get it to work in wordpress

[junologue]

I am trying to get this working with my navigationbar in wordpress, and using different sections in my theme to change the text color in the navigation between black and white. i can't get it to work, and it doesn't seem to clone the header as in your examples.

thanks!

[ghost]

Hello @junologue There is a 404 error on the page you provided.

[junologue]

Oh! Yeah i have been trying different stuff.

6 aug. 2018 kl. 17:19 skrev The Real Žvýd notifications@github.com:

Hello @junologue There is a 404 error on the page you provided.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[junologue]

I think i have removed the proper class and id on the header now tho, since i wrote this. I sort of gave up, but if you could provide me with a solution or a small guide, i would be forever grateful

[ghost]

Sure, give me a bit to look into this.

[ghost]

@junologue I see you're correctly loading both the jQuery UI widget factory and the clipthru library, but you're not marking any elements as blocks for the clone creation. If you look at the demo, each of the block elements has a data-jq-clipthru="testclass-0" attribute. That tells the library to create a clone with a class testclass-0 when an overlap happens. Then you can style this class with a different color (or different anything) and the library should work fine from there as everything else is looking good. You can also directly specify the blocks when you instantiate the library as suggested in the readme with the blockSource option.

[ghost]

@junologue Looking again, I can't find any element with a class menu in the page on which you're instantiating the library. Perhaps you're looking for $('header').clipthru()? Btw, I think the effect you're looking for could end up really cool in this design! 💃

Let me know if you need any further help.

[junologue]

Hi! @mystrdat

I got it to work now so thank you so much!!

The only problem is that i can't give my wordpress sections the data-jq-clipthru value in any easy way. do you know any way of making a php or js-code that automatically adds this value to all my sections that i give (for example) class: darksection

This would be amazing.

[junologue]

i sorted it out! thanks anyway @mystrdat and have a really nice day!

i used this:

$(function() {

    $(".sectiondark").attr('data-jq-clipthru', 'banner1');

    $(".sectionlight").attr('data-jq-clipthru', 'banner2');
});

[ghost]

@junologue Hi again, I think you can use a more elegant solution without modifying your elements in the page through a separate script, try this:

$('header').clipthru({
  blockSource: {'banner1': ['.sectiondark'], 'banner2': ['.sectionlight']}
})

[junologue]

Oh thanks man! @mystrdat

there is a collision going on now tho. through semplice i have a jquery OnLoad script that animates elements on the page when it loads, those doesnt work if they are off screen when you load the page.

Try load the page at first, everything looks good. And then you scroll down a bit and reload, and after that you scroll up to the top section again.

Then it's not fully loaded.

Any ideas of what to do? I really love those small smooth animations, so i dont wanna just skip them

[junologue]

@mystrdat

does it have something to do with this error in console?

Uncaught TypeError: Cannot read property 'def' of undefined at Object.swing (frontend.min.js?ver=4.1.1:8) at init.run (jquery.js?ver=1.12.4:4) at i (jquery.js?ver=1.12.4:4) at Function.n.fx.timer (jquery.js?ver=1.12.4:4) at qb (jquery.js?ver=1.12.4:4) at HTMLDivElement.g (jquery.js?ver=1.12.4:4) at Function.dequeue (jquery.js?ver=1.12.4:3) at HTMLDivElement. (jquery.js?ver=1.12.4:3) at Function.each (jquery.js?ver=1.12.4:2) at a.fn.init.each (jquery.js?ver=1.12.4:2)

[junologue]

it works now, when i removed those 2:

[ghost]

@junologue

Ok! Not sure what the problem was exactly, but the error didn't sound like coming from clipthru. Do I take it everything works on your end now and the issue is solved?

[junologue]

Yes it’s solved now! Thank you very much for your help.