/    Sign up×
Community /Pin to ProfileBookmark

Using Button to toggle Image Does Not Work

This is my first post. I am CSS Intern at Creative Core in San Francisco. Following an example on pg. 250-1 of the book “DHTML for the World Wide Web” uses CSS and JavaScript to toggle an image on and off. My html editor error messages tell me “document object undefined among other things. Please help me.

Example

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>

<html>
<head>
<style type=”css”>
#march-hare {position: relative;}
</style>
<script language=”JavaScript” type=”text/javascript”>
function toggleVis(currElem) {
dom = eval(docObj + ‘.’ + currElem + styleObj);
state = dom.visibility;
if (state == “visible” || state == “show”)
{dom.visibility = “hidden”;}
else {dom.visivility = “visible”;}
}

<!–

//–>
</script>

</head>
<body>
<form action=”” method=”get”>
<div id=”march-hare” style=”position: relative;
visibility: hidden; font: bold 18pt/18pt helvetica;”>
<img src=”march-hare-5.jpg” width=”403″ height=”322″ alt=”march-hare-5.jpg”>
Hi There!
</div>

<input type=”button” value=”toggle” onClick=”toggleVis(‘march-hare’)”>
</form>

</body>
</html>

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@TheBearMayMar 06.2008 — Try changing:
<i>
</i>else {dom.visivility = "visible";}

to <i>
</i>else {dom.visi[B][COLOR="Red"]b[/COLOR][/B]ility = "visible";}
Copy linkTweet thisAlerts:
@JMRKERMar 06.2008 — May not be the only error, but change

<style type="css">

to

<style type="text/css">

for starts.
Copy linkTweet thisAlerts:
@harryjrauthorMar 06.2008 — Wow such a quick reply, just made the change getting same message
Copy linkTweet thisAlerts:
@JMRKERMar 06.2008 — Where are 'docObj' and 'styleObj' coming from in:

dom = eval(docObj + '.' + currElem + styleObj);
×

Success!

Help @harryjr 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.18,
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,
)...