The Manhatten Project wrote:
Hmmm, my idea is that I could potentially create a new effect (if one
does not already exist) which when onMouseOver creates a border around
a span/div. I could like that onMouseOut it removes said border. I
have done it "normally" by creating normal functions for the two mouse
events but I was hoping/wondering is the library could provide a
cleaner more efficient way... ;-)
This type of effect can be achieved quickly with Prototype rc2 using css
classes or css styles, but scriptaculous 1.7 provides an even more
exciting effect: Effect.Morph. Here is a short function with a classic
css-class approach:
<html><head>
<script language="javascript" type="text/javascript"
src="/js/libs/prototype/prototype.js"></script>
<style media="screen" type="text/css">
#test { padding: 2px }
.borderOn { padding: 0px !important; border: 2px solid #f00 }
</style>
</head>
<body>
<div id="test">Mouseover Me</div>
<script language="javascript" type="text/javascript">
function addCssEffect(element, cssClass) {
$(element).observe('mouseover',function(evt) {
Event.element(evt).addClassName(cssClass);
}.bindAsEventListener())
.observe('mouseout',function(evt) {
Event.element(evt).removeClassName(cssClass);
}.bindAsEventListener());
}
addCssEffect('test','borderOn');
</script>
</body></html>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby on
Rails: Spinoffs" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
