I have a few questions about the way I have this code set up

Let’s start with, what in this code can I remove, that I don’t need?

What I want to do is keep the html 5 player invisible, allowing it to auto play when you click on it.

Do I need this whole code to do that, or can I remove some of that? Can I use only display:none, and get rid of everything else? or do I need the other stuff also? Suggestions and recommendations are welcome.

[display:none" frameborder="0" marginwidth="0" marginheight="0" width="0px" height="0px]

http://www.cssdesk.com/m2zEd

<div style="width:266" onclick="myscr=document.getElementById('myscroll'); myscr.style.display='block'; this.style.display='none'">

<a href="http://162.213.197.50/;" style="display:block;margin: 0px 0px 0 0px; width: 88px; height: 24px; cursor: pointer; background-color:#ffffff; color:#000000; border-left: 89px solid #00ffff;border-right: 89px solid #ff00ff;border-radius: 50px;color:transparent;" target="frame"></a>
</div>

<div id="myscroll" style="display: none;">

<div style="width: 88px; height: 24px; cursor: default; background-color:green; color:#000000; 
border-left: 89px solid red;border-right: 89px solid blue;border-radius: 50px;">

<iframe style="display:none" frameborder="0" marginwidth="0" marginheight="0" width="0px" height="0px" name="frame"></iframe></div></div>

For a start you should get rid of the inline styles and so them properly as per several previous threads.

I’m keeping the inline, anything other than that?

You can comment out sections of your code and see if/how anything changes, or you could use the browser dev tools to do the same thing.

1 Like

What do you mean, please explain.

Do I need all of this [frameborder="0" marginwidth="0" marginheight="0" width="0px" height="0px"] If it works how it’s supposed to with just display:none?

No, but you will need them (if they’re not accounted for in css) when the item is changed from display:none

You can add comments to HTML or CSS code, and instruct browsers to ignore them by indicating that they are just comments. In HTML you would do it like this: <!-- This is just a comment --> You can use those same markers to “comment out” sections of your code for testing, so that the browser will ignore them. It’s often easier than deleting and reinstating text.

Most (all?) browsers come with in-built developer tools which let you see the effects of removing or changing items without editing the code.

I’m only using inline though. no css.

Inline css IS still CSS - it’s just a maintenance nightmare. And no, using blogspot/blogger is not an excuse for doing so as it’s easy to setup there as well. (@Mittineague even gave you exact instructions on how to do it in one of your many earlier threads)

To get back to your specific question…In your example above, you could just get rid of all of it since it’s all zeroed out. But you could set the element up as you want it to view when it IS visible, and just change the display style.

<iframe style="display:none; margin: 1px; border: 1px solid red;" id="frame" name="frame"></iframe>

This is how it looks visible.

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