Please keep
voting for us
as a Top 100
Web site!
|
|
|
Setting Up JavaScript Rollovers; Site Redirects; CSS for Link Colors
By David Fiedler and Scott Clark
Dear Dr. Website: I've found some sites that say you can do rollovers with three simple lines of code, but when I try, I get error messages. I'm using FrontPage 98, and here's the code I'm using:
<a href="javascript:nothingMuch();"
onMouseOver="yaImgChange(11,'img1.gif');"
onMouseOut="yaImgChange(11,'img2.gif');">
< img src="/old?u=http%3A%2F%2Fwebdeveloper.com%2Fdrweb%2Fimg1.gif&y=1999"></a>You're confusing placeholders or shorthand (such as "nothingMuch" or "yaImgChange") with actual code. Yes, the HTML is only three lines, but you do need actual JavaScript. The following is courtesy of Macromedia Dreamweaver.
<html>
<head>
<script language="JavaScript">
<!--
function MM_preloadImages() { //v1.2
if (document.images) {
var imgFiles = MM_preloadImages.arguments;
var preloadArray = new Array();
for (var i=0; i<imgFiles.length; i++) {
preloadArray[i] = new Image;
preloadArray[i].src = /old?u=http%3A%2F%2Fwebdeveloper.com%2Fdrweb%2FimgFiles%5Bi%5D%3B%3CBR&y=1999> }
}
}
function MM_swapImage() { //v1.2
var i,j=0,objStr,obj,swapArray=new
Array,oldArray=document.MM_swapImgData;
for (i=0; i < (MM_swapImage.arguments.length-2); i+=3) {
objStr = MM_swapImage.arguments[(navigator.appName == 'Netscape')?i:i+1];
if ((objStr.indexOf('document.layers[') == 0 && document.layers == null) ||
(objStr.indexOf('document.all[') == 0 && document.all == null))
objStr = 'document'+objStr.substring(objStr.lastIndexOf('.'),objStr.length);
obj = eval(objStr);
if (obj != null) {
swapArray[j++] = obj;
swapArray[j++] = (oldArray==null || oldArray[j-1]!=obj)?obj.src:oldArray[j];
obj.src = /old?u=http%3A%2F%2Fwebdeveloper.com%2Fdrweb%2FMM_swapImage.arguments%5Bi%2B2%5D%3B%3CBR&y=1999> } }
document.MM_swapImgData = swapArray; //used for restore
}
//-->
</script>
<script language="JavaScript">
<!--
function MM_swapImgRestore() { //v1.2
if (document.MM_swapImgData != null)
for (var i=0; i<(document.MM_swapImgData .length-1); i+=2)
document.MM_swapImgData[i].src = /old?u=http%3A%2F%2Fwebdeveloper.com%2Fdrweb%2Fdocument.MM_swapImgData%5Bi%2B1%5D%3B%3CBR&y=1999> }
//-->
</script>
</head>
<body bgcolor="#FFFFFF">
<a href="#" onMouseOver="MM_swapImage
('document.img1','document.img1','img2.jpg')"
onMouseOut="MM_swapImgRestore()">
<img src="/old?u=http%3A%2F%2Fwebdeveloper.com%2Fdrweb%2Fimg1.jpg&y=1999" width="160" height="120" name="img1" border="0">
</a>
</body>
</html>
Dear Dr. Website: Is there HTML or JavaScript code that can change any or all of the link colors anywhere within a single HTML page? I'd like to use light-colored links on a black menu panel and then change them to dark-colored links on white for the content area.
Neither JavaScript nor HTML, but Cascading Style Sheets to the rescue. All you have to do is something like this before the first area:
<style>
A:link { background: black; color: white; }
A:visited { background: black; color: yellow; }
A:active { background: black; color: cyan; }
</style>
and like this before the second:
<style>
A:link { background: white; color: blue; }
A:visited { background: white; color: red; }
A:active { background: white; color: brown; }
</style>
They'd have to be separate tables, though, and at the moment, this works properly only with fourth-generation browsers.
Dear Dr. Website: I changed Web servers (from AOL to Xoom). How do I redirect users to my new location when they type in my AOL address?
An oldie but goodie! Simply set up your old page something like this (and be careful with the quotes):
<HTML>
<head>
<meta HTTP-EQUIV="Refresh" CONTENT="0; URL= http://www.newdomain.com/newhomepage.html">
</head>
</HTML>
Visit The Dr. Website Archives.
Click here for a list of Dr. Website's most frequently asked questions (and answers!).
Send your own question to Dr. Website.
Copyright © 1999
internet.com CorporationAll Rights Reserved. Legal Notices.
Contact the WebDeveloper.com staff
Last modified: Wed Sep 22 06:06:28 EDT 1999
Refresh Daily
Join Editor-in-Chief David Fiedler
and find truth, justice, and a clue or two.
ActiveX / VBscript Animated GIF Archive Browsers CGI / Perl Database Connectivity E-Commerce HTML-Advanced: DHTML, CSS HTML / Site Authoring Tools Intranet/Groupware Java JavaScript Multimedia: Audio / Video / Streaming Technologies Opinions Refresh Daily: Editorial Column Security Servers & Server Tools Site Design / Graphics Site Management / Marketing / Log File Analysis VRML / 3D XML
