Skip navigation.

Flash blocking with user stylesheet

, , , ,

Edit 2007-04-21: outdated, doesn't work in Opera 9. Use this userscript instead.

Entrepid Opera user Fabian has created this very cool Flash-blocker. In involves nothing more than adding a few lines to your user stylesheet:

embed[type="application/x-shockwave-flash"] {content:"Flash"; outline: 1px dotted gray; color: gray; background: black}
embed[type="application/x-shockwave-flash"].zichtbaar {content: normal; outline: none}

body:before {
position: absolute; visibility: hidden;
background-image: url("javascript:(function(){window.onclick=function(){var srcElem=window.event.srcElement;var tag=srcElem.tagName;if(tag=='EMBED') srcElem.className='zichtbaar'};})()");
content:""}

This will replace Flash movies with a black area with the word Flash on it, and clicking on the area will play the Flash movie. Depending on the HTML code of the page, the replacement block might collapse dimensions. This blocker will only block display, it wil not block loading the Flash, so on clicking the Flash immediately starts playing.

Get the code from this zip to be sure you are not fooled by linebreaks:
<http://my.opera.com/forums/attachment.php?postid=744450>

Maybe I should write something about the easiest way to work with custom stylesheets. Later!

Search.ini updatesBrowsing at school

Comments

Moose 27. November 2004, 01:22

I don't think that Javadcript in CSS deserves popularization. This is very dangerous for CSS as a tool. In my opinion Opera should drop support for this.

M.

Rijk 27. November 2004, 01:22

Why? I remember this has been discussed on www-style@w3.org, when people commented on the pros and cons of embedding things like XBL in stylesheets. And the conclusion was, that it is not any more dangerous than Javascript in HTML.

If you think JavaScript is dangerous, you should disable it. It doesn't matter whether you embed the script in a document with a script element, or in a more roundabout way with a stylesheet like this.

As it *is* a rather esoteric method, I doubt it will become popular. It is used in a user stylesheet here because there is no other way to bind behavior to third-party documents. If we would have userscript support, it wouldn't be needed.

saito 27. November 2004, 01:22

Hello, Rijk, thanks for the useful tips. I added the lines in my browser.css and changed the background-color and font-size a bit. I am so impressed to see the 'Flash', till I tried to click 'Reply' to someone or 'Delete' spam at GMail, which you've invited me some time ago.
Do they use Flash at gmail.com? I don't think so, but after comment out the lines I added, it comes to work again on 760TP3.

saito 27. November 2004, 01:22

TP4 build 7364b still cannot 'Reply' or 'Send', 'Delete SPAM' at GMail with this lines, which is so sorry.

For a while, till 760 Release, will try to use 'Open in Firexxx' at GMail.

hallvors 27. November 2004, 01:22

- took me a loong time to notice this post :-)

The JS sets window.onclick - that probably overwrites GMail's own window.onclick and breaks things. The script should use

window.addEventListener('click' , function(){var srcElem=window.event.srcElement;var tag=srcElem.tagName;if(tag=='EMBED') srcElem.className='zichtbaar'}, false)

Gspusi 27. November 2004, 01:22

Hallvors, took me a while too to read your comment, danki to Tracio who pointed me here.

This script does the trick, thank you. :)

kiwibird 27. November 2004, 01:22

Where exactly in the script does that go? Could someone post the full script, or update the file to work with GMail?

kiwibird 27. November 2004, 01:22

right now, my script looks like this, and it blocks but won't let me unblock flash:

embed[type="application/x-shockwave-flash"] {content:"Flash"; outline: 1px dotted gray; color: gray; background: black}
embed[type="application/x-shockwave-flash"].zichtbaar {content: normal; outline: none}

body:before {
position: absolute; visibility: hidden;
/*
background-image: url("javascript:(function(){window.onclick=function(){var srcElem=window.event.srcElement;var tag=srcElem.tagName;if(tag=='EMBED') srcElem.className='zichtbaar'};})()");
*/

background-image: url("javascript:(function(){window.addEventListener('click', function(){var srcElem=window.event.srcElement;var tag=srcElem.tagName;if(tag=='EMBED') srcElem.className='zichtbaar'}, false);})");

content:""
}

jebediah 27. November 2004, 01:22

Try replacing the background-image line with this:
background-image: url("javascript:window.addEventListener('click', function(){var srcElem=window.event.srcElement;var tag=srcElem.tagName;if(tag=='EMBED') srcElem.className='zichtbaar';}, false)");

leuce 7. October 2005, 08:09

I would realliy like to try this... but to which CSS must I add it? There are several CSS files in my Opera directory.

villiansv 29. October 2005, 02:21

right now my code looks like this:




embed[type="application/x-shockwave-flash"] {content:"Flash"; outline: 1px dotted gray; color: gray; background: black}
embed[type="application/x-shockwave-flash"].zichtbaar {content: normal; outline: none}

body:before {
position: absolute; visibility: hidden;
background-image: url("javascript:window.addEventListener('click', function(){var srcElem=window.event.srcElement;var tag=srcElem.tagName;if(tag=='EMBED') srcElem.className='zichtbaar';}, false)");
content:""}



pretty much the same as listed above (i changed to window.addeventlistener since i was having problems with GMail too). however, i installed the opera 9 preview and a problem appeared. when browsing the my.opera.com forums, every time a page (of these forums) loads, opera takes up 100% of the cpu for about 5 seconds. i've isolated the problem to this piece of code above (as in, removing it from my user.css file means no problems, and having it in means they exist). can anyone look into it and find a solution? thank you inadvance.

EDIT: the problem was not present under opera 8.5 with the same setup.

EDIT 2: i believe the problem can be found in the http://my.opera.com/community/js/menu.js file, which also has something like addeventlistener in it. more than that i cannot help, i never wrote 2 lines of code in my life, but perhaps someone could alter the flashblock code a little so it works again?

Anonymous 14. December 2005, 04:05

megabob6666 writes:

I have altered the css code to include the same image that comes with the Firefox Flashblock extension for Opera 8.51.

embed[type="application/x-shockwave-flash"] {
content: url(http://img467.imageshack.us/img467/9899/flashblock2tp.gif);
}
embed[type="application/x-shockwave-flash"].zichtbaar {content: normal; outline: none}

body:before {
position: absolute; visibility: hidden;
background-image: url("javascript:window.addEventListener('click', function(){var srcElem=window.event.srcElement;var tag=srcElem.tagName;if(tag=='EMBED') srcElem.className='zichtbaar';}, false)");
content:""}

Create a css file in your Opera\styles directory and name it user.css; paste the above code into this file and save it. To enable the code, you have to go to Tools and then Preferences. Click on Advanced and then the Style Options button. Navigate to the user.css file you just created and select it. Ensure that the My Styles check boxes are checked and then click on OK and then OK again. Restart the browser and the Flashblock button will appear when flash banners are encountered; you can click on them to play the flash.

Anonymous 15. April 2006, 04:36

rich writes:

Thanks for the tip about flash blocking! It takes care of those that can't be blocked by disabling Flash.

BTW - how does Flash load on a site if not by javascript? I've searched the page code in such cases and can never see a reference to Shock, Flash, .swf

thanks,

rich

Rijk 15. April 2006, 16:26

Please note that this is an old post. Much better options are available in Opera 8 (userscripts). Embedding Javascript in CSS will be disabled completely in Opera 9.

Flash can be embedded with the EMBED or OBJECT elements, where the URL to the actual flash should be visible somewhere in the source code as an attribute on or nested in (PARAM element) these elements.

TroyIII 7. July 2008, 06:07

I don't know where to post this - I found that this is the only page that mentions the notion in the context of my huge problem.

CAN ANYBODY - P L E A S E - TELL ME, HOW TO REMOVE THE OPERA OUTLINE FROM MY BUTTONS???


I am building a page with enhanced accessibility functions, but Opera is giving me a major headache.

Is there anyway ( Opera way ) to remove the default outlining style and especially the FOCUS navy selection color from my navigation buttons please?

Many thanks in advance.

Rijk 7. July 2008, 09:28

Please use the forums for such questions.

Write a comment

You must be logged in to write a comment. If you're not a registered member, please sign up.

July 2009
S M T W T F S
June 2009August 2009
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31