List Info

Thread: I need code examples....




I need code examples....
user name
2006-01-25 19:24:57
I am absolutely new to this Behaviour world, I use prototype already.

I would like to receive (if is possible) any code showing example using Behaviour.

In what situation I would need (or would be better) to use Behaviour?

thanks
I need code examples....
user name
2006-01-26 12:43:48
Wherever you have a pattern of behaviour in performing
operations upon
elements with the same css pattern.

E.g.
Consider that this is some HTML...
<ul id='example'>
  <li onclick="clicked();">Test 1
  <li onclick="clicked();">Test 2
  <li onclick="clicked();">Test 3
</ul>

Our aim is to have nice HTML like this:
<ul id='example'>
  <li>Test 1
  <li>Test 2
  <li>Test 3
</ul>

and then do the following (without behaviour.js)
<script>
var ulNode = document.getElementById('example');
var liNodes = ulNode.childNodes;
for (var i = 0; i < liNodes.length; i++) {
  liNodes[i].onclick = function() { click(); };
}
</script>

But that's ugly too.

So, instead we do this:
<script>
var rules = { '#example li' : function(element) {
element.onclick =
function() { click(); } } }
Behaviour.register(rules);
</script>

And we have a picture of loveliness.

Epilogue:

The function(element) { ... } part is executed for each DOM
element
that matches the rule (e.g. '#example li'). So, what we're
doing is
specifying a loop expression inside the { ...} part. In the
example,
we're assigning each element a function to its onclick
attribute.

But, you could do anything with/to the element. Mostly I
think ppl
using it to assign things to onclick, onmouseover, etc. 

Cheers
Nic

I need code examples....
user name
2006-01-26 20:02:46
Dom modification goes good in there too...

Ben

On 1/27/06, drnicwilliams < drnicwilliamsgmail.com">drnicwilliamsgmail.com > wrote:

Wherever you have a pattern of behaviour in performing operations upon
elements with the same css pattern.

E.g.
Consider that this is some HTML...
&lt;ul id='example'>
&nbsp; <;li onclick=&quot;clicked();"&gt;Test 1
 &nbsp;<li onclick=&quot;clicked();"&gt;Test 2
 &nbsp;<li onclick=&quot;clicked();"&gt;Test 3
</ul&gt;

Our aim is to have nice HTML like this:
<ul id='example'>
&nbsp; <;li>Test 1
 &nbsp;<li&gt;Test 2
 &nbsp;<li&gt;Test 3
</ul&gt;

and then do the following (without behaviour.js)
<script>
var ulNode = document.getElementById('example');
var liNodes = ulNode.childNodes;
for (var i = 0; i < liNodes.length; i++) {
 &nbsp;liNodes[i].onclick = function() { click(); };
}
</script>

But that's ugly too.

So, instead we do this:
<script>
var rules = { '#example li' : function(element) { element.onclick =
function() { click(); } } }
Behaviour.register (rules);
&lt;/script&gt;

And we have a picture of loveliness.

Epilogue:

The function(element) { ... } part is executed for each DOM element
that matches the rule (e.g. '#example li'). So, what we're doing is
specifying a loop expression inside the { ...} part. In the example,
we're assigning each element a function to its onclick attribute.

But, you could do anything with/to the element. Mostly I think ppl
using it to assign things to onclick, onmouseover, etc.

Cheers
Nic


[1-3]

about | contact  Other archives ( Real Estate discussion Medical topics )