Streaming live at 10am (PST)

How to embed a Jsfiddle


#1

Hi there

I’m in need of some one who understands coding :slight_smile:
I want to make this Jsfiddle work in my Website:
https://jsfiddle.net/signsi/3poubvy3/#&togetherjs=92ePdpPPDL

Where do I have to put the HTML, the CSS and the JS?

Thanks for your answers in advance :slight_smile:

Cheers

Samuel


#2

Hey @samuelherzog,

Definitely a great question.

I was able to get a partial solution with the code provided within Jsfiddle, and you can view the implementation at the following URLs (running into an issue with the image showing near the pointer):

The custom code can be found in before the tag:
21%20PM

The following link is extremely helpful if you’re interested in learning where custom code can be added:

Right now, I’m working on creating this with IX2. I’m pretty sure it can be done :blush:

I’ll provide an update shortly :nerd_face:

Talk with you soon,
Micah


#3

Hi @samuelherzog,

I was able to get the interaction working using Webflow’s IX2, and you can view the interaction at the following URL:

Hopefully this helps, and definitely reach out if you have any questions at all :blush:

Best regards,
Micah :nerd_face:


#4

Hi Micah

Thank you so much.
I will try to use your tips on my site, as soon as possible!

Your the best!!!

Greetings from Switzerland

Samuel


#5

Hi Micah

So I tried to put your tipps in my website.
I got sooooo close, but something isn’t working :frowning:
Can you have a look and telle me where I made a fault?

I would highly appreciate your help :slight_smile:

Thanks a lot:

Live site: http://ez2-portfolio.webflow.io/
Share Link: https://preview.webflow.com/preview/ez2-portfolio?preview=c014806e1e7ab43fb43d9ed3d52aef5d

best greetings from snowy switzerland

Samuel


#6

Great question, @samuelherzog!

I took a look at your share link, and we’re almost there. :wink:

I noticed that the “Hide” interaction was set to affect “Only children”

It should affect “Only siblings”

The following video will show where the change should be made:

Hopefully this helps, and feel free to reach out if you have any questions. :blush:

Best regards,
Micah :nerd_face:


#7

I can not believe you help me with this problem!
For that, I thank you very much, the work you do is not self-evident!:+1::+1::+1:

Another question:

How do I let the image move with the cursor?

Best regards,

Sam


#8

Hi @samuelherzog,

The IX2 example would work best for moving with the cursor as Webflow easily allows for that type of interaction. Check the Webflow share link to see how it’s completed:

The interaction requires the element trigger “Mouse Move Over Element”

Definitely feel free to let me know if you come to any roadblocks :blush: