Topic: Can I assign a script to a CSS class? (Page 1 of 1) Pages that link to <a href="https://ozoneasylum.com/backlink?for=21934" title="Pages that link to Topic: Can I assign a script to a CSS class? (Page 1 of 1)" rel="nofollow" >Topic: Can I assign a script to a CSS class? <span class="small">(Page 1 of 1)</span>\

 
Grover
Obsessive-Compulsive (I) Inmate

From:
Insane since: May 2004

posted posted 05-25-2004 06:28

I want to assign a "OnMouseOver" to every object in a particular class. Can this be done?

For example I want a bunch of links with the same MouseOver, so can I assign them a class that has a mouseover assigned to it?

DmS
Paranoid (IV) Inmate

From: Sthlm, Sweden
Insane since: Oct 2000

posted posted 05-25-2004 10:50

I don't really understand what you mean here.
Do you want your links to react when you mouseover them, changing class/appearance or something like that?

In that case just use :hover
Like this.
<a href... class="linkClass">text</a>

then in the css
.linkClass{
your styles: here;
}

.linkClass:hover{
your styles for when the cursor is over the link: here;
}

Or du you need to call a javascript that does something as well from the css?
We need more info...

/Dan

{cell 260}
-{ a vibration is a movement that doesn't know which way to go }-

poi
Paranoid (IV) Inmate

From: France
Insane since: Jun 2002

posted posted 05-25-2004 12:10

Otherwise, Google & getElementsByClassName are your friends mate.

Grover
Obsessive-Compulsive (I) Inmate

From:
Insane since: May 2004

posted posted 05-25-2004 17:40

Well I'm not sure what example I can give, but basically I want to have a class that has a script attached to it, so any object assigned that class will perform the script on mouseover or by clicking it.
I know I can change the style of links with hover, but I'm looking to do much more, and not necessarily with links.
For example I might want to change my background to a different color whenever the mouse passes over a different picture. I'd want to give the pictures in question a class that has a built-in script which would do just what I want.

poi
Paranoid (IV) Inmate

From: France
Insane since: Jun 2002

posted posted 05-25-2004 18:18

Yes, it can be done, using the DOM.
cf: DOM Reference or Peter-Paul Koch's old W3C DOM Compatibility Table

WarMage
Maniac (V) Mad Scientist

From: Rochester, New York, USA
Insane since: May 2000

posted posted 05-25-2004 18:22

If you want to modify the CSS when a mouse moves over an object you will need to make use of the :hover selector.

I haven't used IE in a long while, and I only open it up to test something I am working on to make sure that it works. But I believe that :hover only works on an anchor link. This is a bit annoying but you can achieve the functionality you are looking for by linking two instances together.

.class a {
...
}

.class a:hover{

}

which would allow for the hover functionality. But you would have to have your content encapsulated in an anchor. Which isn't always what you might want.

I am sure you could achieve this functionality using Javascirpt but you could not trigger the javascript through CSS. The Scripting sits on top of the CSS. This means that the Script can access the CSS but the CSS doesn't even know that the Scripting exists, and therefore does not have the ability to access it.

You would have to use onmouseover="somecode" if you want javascript functionality.

InI
Paranoid (IV) Mad Scientist

From: Somewhere over the rainbow
Insane since: Mar 2001

posted posted 05-25-2004 18:29

The poster has demanded we remove all his contributions, less he takes legal action.
We have done so.
Now Tyberius Prime expects him to start complaining that we removed his 'free speech' since this message will replace all of his posts, past and future.
Don't follow his example - seek real life help first.

Grover
Nervous Wreck (II) Inmate

From:
Insane since: May 2004

posted posted 05-28-2004 09:21

Well I figured this out by pure luck/coincidence. I was looking on a way to make a css hover that would work in IE, as IE only seems to accept hovers on links.
It's possible to attach a script to a CSS class or ID through the use of .htc files
They're used as follows:

.class {
behavior: url(file.htc);
}

and file.htc contains:

<public:component>
<public:attach event="OnMouseOver" onevent="ScriptName>
<script language="javascript">
function ScriptName {
//script goes here
}
</script>
</public:component>


This way, for example, you could add an OnClick function to a table cell or a div, or any html tag through the use of a class or ID. You could even add it directly through the html via style="behavior: url(file.htc);"
This makes me happy

poi
Paranoid (IV) Inmate

From: France
Insane since: Jun 2002

posted posted 05-28-2004 11:50
quote:
Grover said:

as IE only seems to accept hovers on links.


You'd better say: "as IE accept hovers only on links, and the behavior property is another of those proprietary monster." Otherwise, if you can afford to make a script that work only in IE with Windows, go for it.

[edit] At the risk of repeating myself, getElementsByClassName() is the method I'd use for its simplicity and compatibility. [/edit]



(Edited by poi on 05-28-2004 13:00)



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu