homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
Forum Library, Charter, Moderators: not2easy

Site Graphics and Multimedia Design Forum

Using transparent .png as filter over content

5+ Year Member

Msg#: 3864733 posted 12:01 am on Mar 7, 2009 (gmt 0)


website content is shown on a crt screen imitating graphics. The content has the effect of refresh frequency.

Method tried:

I displayed the content, text, links, images, etc, in a div.
directly on top of it I positioned an another div element with higher z-index. The content was nicely filtered with the divs background image "horizontal lines, which could be animated".


The higher z-index element prevents any interaction with the content by mouse.


Is there any way to accomplish this?



WebmasterWorld Senior Member 10+ Year Member

Msg#: 3864733 posted 2:05 am on Apr 3, 2009 (gmt 0)

In short, you are just using an old trick to try and stop people from pulling your content, and assuming that a transparent cover will stop them. IMO, don't waste your time. It isn't going to even slow down the competent, and the incompetent are not a threat.

Better to protect content by monitoring for anything stolen and then doing C&Ds and DMCAs.


5+ Year Member

Msg#: 3864733 posted 7:46 am on Apr 3, 2009 (gmt 0)

Thanks for the reply D_Blackwell, but you have misunderstood my intentions. Perhaps I wasnt clear enough.

Ultimate goal is to achieve graphical interface with a filter layer on top of the content.


layer 0
the content, text, images, videos etc.

layer 1
png-image gif-animation.

Layer 1�2 function is to have a such effect that it resembles the old ctr flickering. See the skeleton at <snip>

One suggestion that i have tried yet is that I lock an 1x1px div at the top left of the "screen" and allow the image to span over the div�s border. Might not work.

Also i have seen on some websites a falling snowflakes across the display. Those are accomplished by javascript i presume?

Anyone tried anything similar? Help is appreciated!

No URI's please, see TOS [webmasterworld.com]

[edited by: limbo at 3:58 pm (utc) on April 3, 2009]


5+ Year Member

Msg#: 3864733 posted 5:43 pm on Apr 14, 2009 (gmt 0)

I have been messing with transparency designs for a while now. There is a way to do what you want do and still have people able to interact with the site. However there is an issue. PNGs are the only image format that will give you the type of transparency that you need. But they can only be static. You can only animate gifs.

So if you want a flicker effect you will have to find a java script to do so. But think twice about doing so. Most people don't like visiting a site with "too much going on".

But if you want to go static you will be doubling your work (content, css, images) neat effect but not really wise for file size and upkeep. Maybe think about doing it on just sections of your page.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / Site Graphics and Multimedia Design
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved