/    Sign up×
Community /Pin to ProfileBookmark

Modifying suckerfish to work with focus….

Hello, I have tried to modify the JavaScript from the [url=”http://www.alistapart.com/articles/dropdowns/”]suckerfish dropdowns[/url]to work with focusing elements. Here is the modified script:

[code=php]startList = function() {
if (document.all&&document.getElementById) {
for (i=0; i<document.childNodes.length; i++) {
node = document.childNodes[i];
if (node.nodeName==”input”) {
node.onfocus=function() {
this.className+=” focus”;
}
node.onblur=function() {
this.className=this.className.replace(” focus”, “”);
}
}
}
}
}
window.onload=startList;[/code]

And this is the CSS to go along with it:

[code]input:focus, input.focus {
………styles go in here……..
}[/code]

However, it still does not work in IE. What is wrong with my JavaScript?

to post a comment
JavaScript

3 Comments(s)

Copy linkTweet thisAlerts:
@TageJun 12.2004 — First off, I'm sleepy. ? Seriously though, I think replace() is used with [url=http://www.javascriptkit.com/javatutors/re.shtml]regular expressions[/url] and not the way you're using it (easily fixed though). [COLOR=firebrick]Plus, I am not sure if class names can have spaces inside them... (edit:they can)[/COLOR] Also, if I am not mistaken (mind you, I'm not expert at it and I don't keep up to date with the latest CSS techniques) "input:focus" does nothing, and "input.focus" would modify an <input> with a class name of "focus" which would be <input class="focus">. I don't know anything about nodes, btw.

Tage
Copy linkTweet thisAlerts:
@TageJun 13.2004 — Eeeeee. I apologize. A space inside a class name works. I just learned what it does. Something can have two classes at once. That's nifty!

Tage
×

Success!

Help @Daniel_T spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...