Is it possible to declare js event and/or function using only css3?

I know there are methods of adding content to a web page like stated here: http://nooshu.com/adding-content-using-css3

But.. I wonder if there is also a possibility to declare a js event in css on given selected nodes, like:

.myclass {
   declare-js-event: "onclick";
   declare-js-function: "alert('I've been clicked!')"
}

If (as I highly suppose) it is not possible, then are these features at least planned in some future css v4 or is it ruled out b开发者_如何学Goy design and css would never be able to do such things ?

You can declare JavaScript expressions and functions in CSS using IE's expression() function. Another way is to use the url() function.

For example:

// Expression()
selector { width: expression((document.body.clientWidth > 1024)? "1200px" : "960px"); }

// URL()
selector { background: url("javascript: alert('XSS')"); }

Expressions in IE{6,7} add some additional logic that are sometimes used to cover up for the in cross-compatibility for IE; however, using expression() at all isn't recommended.

As cx42net answered, CSS handles presentation whereas JavaScript handles behaviour of a page. Using JavaScript in CSS isn't common and usually manifests itself as an XSS attack as demonstrated in the url() example above.

It's possible to use JavaScript is older browser versions but I think they're slowly removing support for it as IE8+ no longer supports expression(). That said, I don't recommend using JavaScript at all in CSS especially if you expect your website to be Forward Compatible.

No, it's not possible, and I don't think it's planned to be added in the future.

The reason is simple, css stand for "Cascading Style Sheet", so, it aims is to change the visual rendering of an html page.

Not adding functionnalities to it, this works is reserved to Javascript.

But why would you do something like that ? you can just include a script.js in your html file and call what you want when the dom is ready. Something like this in jQuery :

$(function () {
    // do what you want here
    // add onclick event on what you want
    // etc
}