override overflow-y setting??

[Julio2]

It seems that any embed code section is put inside a <div> with the following settings: 

<div><div id="661452967320186730" align="left" style="width: 100%; overflow-y: hidden;" class="wcustomhtml">

<div class="container">

My embed html code starts at the class="container"  Weebly is inserting the two div tags before my div.. 

I need to override the overflow-y: hidden; to make it overflow-y: visible. 

How is this possible? 

[Queso]

Hello Julio!

Our Community here may be able to lend a further hand on the details, but you may want to consider checking out the Code Editor as well, if you're looking for ways around the Embed Code element's functions.

[AngelXAces]

Ooh this is a tough one. Weebly interference is always a struggle but it's not tamper proof. here's somethings for you to try:

That div with the id, it's static. That id doesn't change with page reloads.

Spoiler

I'm an a**hole. People are going to look at this and blow it off thinking it's all a long winded explanation of noscript because I compacted the text. I was going to put another code block here just to say, "The JavaScript hack is:" so people will read it because everyone loves to feel like a hacker. Instead, I thought it would be funny to put it in a spoiler because there's nothing secret about noscript tags so it's possible it will be passed off as an abusive use of a spoiler effect... which isn't entirely wrong, I'm just not abusing it in the way they have in mind.

If you don't know javascript I can help you. using custom javascript or jquery I would target that ID. Instead of removing it, and having to write the code to find the correct ending tags which would be annoying I imagine, just remove the style=""  portion. The external style sheet already mostly set of of <div>'s natural defaults back to 0 so it should just act as a benign tag with less effect than a natural span. Leaving the id will likely be appreciated by the devs and ensure that your js doesn't get removed when you're away (some places do that.

You can also try wrapping things inside <noscript> tags. They may screen for that when you save and could either delete it or worse, convert it to ascii which screws with a lot of novice coders because they'll see

<noscript>

and think they're code is making that tag output as plain text like they missed a quotation somewhere. But the code says: &lt;noscript&gt

Which is exactly what they do in that Insert Code module I just used and copied from lol (er I mean... naturally I memorized the ascii code for every alpha-numeric symbol, doesn't everyone?)

Tell me what happens. If those don't work I have a whole bag of tracks for interfering with weebly interference and a couple new toys i've been dying to try out. Below is my theory of what's happening in your case. 

Spoiler

basically here's what it looks like is happening:

Staff has a "no Custom code policy" and they currently are not allowed to touch websites that are using custom code

So when it recognizes code that is not output by Weebly or an add-on it's wrapping it in a div + div with in-line CSS to mark around parts that they can't touch so that they are able to see what parts of the website they are allowed to provide suppor on so that they don't have to avoid providing support completely.

The purpose of the CSS wasto attempt to negate the tag's natural properties so they won't interfere with anything inside of it or outside of it or so it seems. Unfortunately they failed this time.

[Julio2]

Thanks for the pointers... 

I have managed to implement some java script that sets the overflow-y setting to visible, for a given id, and this has nicely solved my issue... 

[AngelXAces]

Nice! I'm extremely happy that worked out for you. Sometimes javascript workarounds get a bit messy. On the flipside though, your question inspired me to submit a feature request I've been sitting on for a while and in it I made sure to consider your struggle
heavily in the design. You can see for yourself, I think you'll like my idea for an improved version of the Embed Code module.You can see it here:
New Improvements on the Embed Code Module

[davejames1234]

Hello Julio, would you care to share that javascript? 

I was just trying to do the same thing but can't get it to work. I was removing the style and inserting 'visible' with jquery but it won't work. 

Thanks in advance. 

[PW72]

@Julio May I ask how you did that? I need for overflow to be yes too

[Julio2]

Here you go.. Add the following javascript to your theme: 

function removeStyle(x) {
  /*document.currentScript.parentNode.style["overflow-y"] = "visible";*/
  /*document.getElementById(x).style["overflow-y"] = "visible";*/
  var removeDom = document.currentScript || (function() {
      var scripts = document.getElementsByTagName('script');
      return scripts[scripts.length - 1];
    })();
    if (removeDom.parentNode.parentNode.style["overflow-y"] == "hidden") {
      removeDom.parentNode.parentNode.style["overflow-y"] = "visible";
    }
  //if (document.currentScript.parentNode.parentNode.style["overflow-y"] == "hidden") {
  //  document.currentScript.parentNode.parentNode.style["overflow-y"] = "visible";
  //  }
	
}

Then add a code block to your page at the top with: 

<script>removeStyle("1");</script>

I'm not an expert at any of this, so it's a bit hacky but it worked...  

Guess I never cleaned up the code I was working with... 

[thoughtleader]

Just had this problem and fixed it like this:

1. Edit your html/css (if you don't know how to do this, you click the "Theme" tab, scroll to bottom of the left menu and click "Edit HTML/CSS").

2. Add this CSS to your main.less file: 

div {
overflow-y: visible !important;
}

Yes this will make overflow-y visible accross your whole site. Which should be OK given that visible is the default value of overflow. However, if you need overflow-y hidden somewhere on your site, try embedding some HTML and assigning an ID, then add to your css files overflow-y: hidden for that ID. I think that should work.