JavaScript Error - Help!

Design help Custom code
1

Hello!

I used the embed feature to embed a JavaScript Widget that came from DAF Direct. However, when I published the site, it shows up with the dropdowns and amount box going outside the box and I’m not quite sure how to fix it. I’ve seen the widget on other websites and it looks just fine - (Example)

This is the code that I was given to embed:

Is there another way to embed a JavaScript code so it’s just within the column I created on the page? Or is Webflow not necessarily JavaScript friendly. I’m a pretty novice web designer (only experience is in Webflow), so I don’t know a ton about custom coding other than the embed feature, which has been great for other things! Any help is appreciated.

Here is my site Read-Only

Here is my published link - You can see how the dropdowns/amount box is off.

2

The width is being controlled by the remote DAF CSS.

You could give that element a width of 100% for example.

Here is a small snippet of jQuery that would do it.

$("#dafdirectdiv").css("width","100%")
3

@webdev - Thank you! This may be a dumb question, but where do I place that snippet within the code?

4

In a script block before the body close custom code area.

5

@webdev - Sorry, I just realized my code didn’t show up in the original message - This is the code I’m using. I don’t think it has a body close?

<script type = "text/javascript">_dafdirect_settings="451068854_2111_6810eb88-4798-4f20-96cf-18e7ba48123f"</script><script type = "text/javascript" src = "https://www.dafdirect.org/ddirect/dafdirect4.js"></script>
6

This is code the overrides the styling of the CSS loaded by your existing script.

7

@webdev - It worked! You’re a genius. Thank you so so much for your help!

8

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.