Back To Website Design Forum

ie filters

  • futurebuzz
  • Student
  • Student
  • User avatar
  • Joined: Apr 13, 2004
  • Posts: 75
  • Loc: Birmingham England
  • Status: Offline

Post April 24th, 2004, 1:04 pm

Hello,

On the site that i am working on, i have some ie filters such as the shadow and alpha filters.

Code: [ Select ]
filter: progid:DXImageTransform.Microsoft.Shadow( Color=000000,direction=155,strength=10,positive=true)


The problem is, they don't show up in any other browsers! Is there a filter type for cross broswers?
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post April 24th, 2004, 1:04 pm

  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: Mar 24, 2004
  • Posts: 1855
  • Loc: Uk
  • Status: Offline

Post April 25th, 2004, 1:31 am

its called flash :wink:

Basiclly the w3c define the css specification (what properties are, the declaration and syntax, and how they display), and then netscape mozilla et al make browsers that come pretty close to the specification. Microsoft then go off and do their own thing.

MSIE doesn't even support all of css1, let alone css2; and they make up their own things (like the filters).

As far as I'm aware the filters will not even become official when css3 comes out.

Flash is the way to create cross browser fancy effects.
CSS website design tutorials
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Joined: Dec 29, 2003
  • Posts: 5169
  • Loc: SC-USA
  • Status: Offline

Post April 25th, 2004, 5:37 am

:roll:

Transparency/Opacity/Alpha:

http://www.domedia.org/oveklykken/css-transparency.php

Drop Shadow

You can create a simple drop shadow effect with z-indexing.

Code: [ Select ]
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style>
    #1{z-index:1;position:absolute;top:100px;left:100px;font-family:sans-serif;font-size:21px;font-weight:bold;color:#C30;}
    #2{z-index:0;position:absolute;top:101px;left:101px;font-family:sans-serif;font-size:21px;font-weight:bold;color:#000;}</style></head>

<body>
<div id="1">Me and my shadow.</div>
<div id="2">Me and my shadow.</div></body></html>
  1. <?xml version="1.0" encoding="iso-8859-1"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head>
  6. <title>Untitled Document</title>
  7. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  8. <style>
  9.     #1{z-index:1;position:absolute;top:100px;left:100px;font-family:sans-serif;font-size:21px;font-weight:bold;color:#C30;}
  10.     #2{z-index:0;position:absolute;top:101px;left:101px;font-family:sans-serif;font-size:21px;font-weight:bold;color:#000;}</style></head>
  12. <body>
  13. <div id="1">Me and my shadow.</div>
  14. <div id="2">Me and my shadow.</div></body></html>


Analogy

The English language isn't dictated by the dictionary. The dictionary is dictated by usage of the English language. Australia, New Zealand, South Africa, The United Kingdom, The United States and Canada, to name a few, all use the English language with subtle differences and variations. Some would say that the people of England proper use English correctly...

...I would disagree.
- dM
  • futurebuzz
  • Student
  • Student
  • User avatar
  • Joined: Apr 13, 2004
  • Posts: 75
  • Loc: Birmingham England
  • Status: Offline

Post April 25th, 2004, 9:43 am

Thanks for the replies folks,

I need to have the x and y code for the mozilla alpha. Needs to fade from one side to another.

Looking for a drop shadow for mozilla too!

Cheers!
  • Truce
  • Guru
  • Guru
  • No Avatar
  • Joined: Apr 25, 2004
  • Posts: 1477
  • Loc: Washington DC
  • Status: Offline

Post April 25th, 2004, 9:00 pm

Check out this site:

<a href="http://www.dynamicdrive.com">Dynaimic Drive DHTML Scripts</a>
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: Mar 24, 2004
  • Posts: 1855
  • Loc: Uk
  • Status: Offline

Post April 26th, 2004, 12:33 am

99% percent chance dynamic drive script will completely ignore mozzilla (as with the script you already have!)

What you could do is to have the script you already have and then add a line that applies the mozzilla alpha filter. That way you will get the moving fade on IE and a straight fade on mozzilla (if that makes sense). Its not a perfect solution, but its not a bad one.

Also It would give you some practice at editing the javascript!
CSS website design tutorials
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: Mar 24, 2004
  • Posts: 1855
  • Loc: Uk
  • Status: Offline

Post April 26th, 2004, 2:06 am

This is a bit difficult to explain, but I'll try:

1: Set the visibility to hidden for all of the drop down elements.

2: as soon as the fade in effect is initiated, set the visibility to visible

3: once the fade out effect is complete, set the visibility back to hidden.

This should give you menus that instantly appear / dissappear in anything but IE.

Again, not a perfect solution, but it works....
CSS website design tutorials
  • futurebuzz
  • Student
  • Student
  • User avatar
  • Joined: Apr 13, 2004
  • Posts: 75
  • Loc: Birmingham England
  • Status: Offline

Post April 26th, 2004, 2:44 pm

OK thanks for the replies!

I still can't do what i want to do, the only option is to change it. There are after all, billions of possibilities.

rtm223... I have fixed the lack of top menu in mozilla and netscape on that page you reviewed for me! It was a java script conflict. I needed to add an on-load thingy to it. I just settled for removing the other script... It was the fader link effect that appears on this site!

Looking good in IE and average in other browsers...
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Joined: Mar 24, 2004
  • Posts: 1855
  • Loc: Uk
  • Status: Offline

Post April 27th, 2004, 12:45 am

thats why plug and play scripts suck ass!

If you wite your own you get to choose all your variable names and you know them inside out, so any conflicts can be resolved easily.
CSS website design tutorials

Page 1 of 1

Post Information

  • Total Posts in this topic: 9 posts
  • Users browsing this forum: No registered users and 107 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 2011 Unmelted, LLC. Ozzu® is a registered trademark of Unmelted, LLC.