scripting help

Status
Not open for further replies.

alloftheabove

New Member
Messages
13
Reaction score
0
Points
0
I seem to be having problems with some javascript I made. WARNING: the javascript I will show you uses Prototype.js || I will also include the page source in case it helps.
Javascript:
Code:
// pulldownExample javascript
var handl = {
//pulldown handler
pdh: function(e){
var desArray = e.descendants();
desArray.each(function(item){
if (item.hasClassName('hidden') == true){
item.removeClassName('hidden');
item.addClassName('shown');
} else if (item.hasClassName('shown') == true){
item.removeClassName('shown');
item.addClassName('hidden');
}
});
}};
$('outer').observe('click', handl.pdh.bindAsEventListener(obj));
and the html:
Code:
<title>Pulldown Link Example</title>
<script type="text/javascript" src="prototype.js"></script>
<style type="text/css">
<!--
#outer div.more a {
display: none;
}
#outer div.click a {
display: inline;
}
div.hidden {
display: none;
}
div.shown {
display: inline;
}
div#outer {
width: 100%;
}
-->
</style>
<script type="text/javascript" src="pulldownExample.js"></script>
</head>
<body>
<div id="outer">
<a>Lorem</a>
<div class="hidden">
<a>Ipsum</a><br />
<a>Dolor</a>
</div>
</div>
</body>
</html>
The point is to make the hidden div appear when the user clicks on the 'outer' div.
Both firebug and the Firefox error console tell me that "$('outer') has no properties".
I don't quite understand, so could someone possibly help me out??

NOTE: I copied this post here from computer forums. If a mod sees this post, please
delete the other one for me
 
Last edited:

deadimp

New Member
Messages
249
Reaction score
0
Points
0
The reason is that your script is executed in the head, most likely before the script engine can find 'outer' as a DOM element. Try putting that one part concerning $('outer') at the end, or have it as part of the on-load callback (however prototype might handle that).
 
Status
Not open for further replies.
Top