Rollovers not working
Hello to all and thankyou in advance for any help with this. This is my first time visiting this forum and I hope posting a question like this is acceptable behaviour.
I am preparing my first website and I can not get the rollovers to load for the social media links in the footer.
Ive noticed that other rollover images are mentioned to preload in the:::: <body onload="MM_preloadImages('Design2.png','Customs2.png','Techstuff2.png','Contact2.png')"> So Im thinking maybe there not loading into the html properly?? but really I got no idea whats going on or what im doing.
Please find below the html for the page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="Styles.css">
<title>Equinox Surfboards Home</title>
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
</script>
</head>
<body onload="MM_preloadImages('Design2.png','Customs2.png','Techstuff2.png','Contact2.png')">
<div class="container">
<div id="header">
<img src="Logo2.png" alt="Equinox Surfboards">
</div>
<div id="guts">
<div id="nav">
<div id="navContent"><a href="equinoxsurfboardsdesigns.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','Design2.png',1)"><img src="Designs.png" alt="Click to go to thr products and design page" width="439" height="40" id="Image5" /></a>
</div>
<div id="navContent"><a href="equinoxsurfboardscustoms.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','Customs2.png',1)"><img src="Customs.png" alt="Click to go to our customs orders page" width="440" height="41" id="Image6" /></a>
</div>
<div id="navContent"><a href="equinoxsurfboardstechstuff.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','Techstuff2.png',1)"><img src="Techstuff.png" alt="Click to go to our technologies page" width="439" height="40" id="Image7" /></a>
</div>
<div id="navContent"><a href="equinoxsurfboardscontacts.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','Contact2.png',1)"><img src="Contact.png" alt="Click to go to our contacts page" width="439" height="40" id="Image8" /></a>
</div>
</div>
<div id="right">
<div id="location"><img src="Ourmissionlong.png" alt="Our Mission Statement" />
</div>
<div id="bodycopyIndex"><img src="Ourmissioncopy.png" alt=" To use our knowledge, skill and creativity along with the latest design technologies, precision CNC cutting and only the best quality materials available to ensure optimal performance and longevity from all our products.">
</div>
</div>
<div id="farrightIndex">
</div>
</div>
<div id="footer">
<div id="contactfoot"><img src="0407233678.png" alt="Phone 0407233678 or email on [email protected]">
</div>
<div id="facebook"><a href="https://www.facebook.com/pages/Equinox-Surfboards/322205431225132?fref=ts" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('facebook','','facebookover.png',1)"><img src="facebook.png" alt="facebook" width="40" height="40" id="facebook2" /></a>
</div>
<div id="tumblr"><a href="http://www.equinoxsurfboardsaustralia.tumblr.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('tumblr','','tumblrover.png',1)"><img src="tumblr.png" alt="Tumblr" width="40" height="40" id="tumblr2" /></a>
</div>
<div id="youtube"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('youtube','','youtubeover.png',1)"><img src="youtube.png" alt="youtube" width="40" height="40" id="youtube2" /></a>
</div>
<div id="twitter"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('twitter','','twitterover.png',1)"><img src="twitter.png" alt="twitter" width="40" height="40" id="twitter2" /></a>
</div>
</div>
</div>
</body>
</html>
Ive noticed that other rollover images are mentioned to preload in the:::: <body onload="MM_preloadImages('Design2.png','Customs2.png','Techstuff2.png ','Contact2.png')"> So Im thinking maybe there not loading into the html properly??
Nah - that's not the problem. If you can post a link to your live page, we can tell you in a jiffy what's wrong.
Similar Messages
-
Dreamweaver rollovers not working in Safari
Hi,
I have been using Dreamweaver's image rollover effects for
years now with no issues. Well, until now. I'm working on a fairly
simple site for a filmmaker. It only includes 3 small rollover
effects.
I've tested the site on my PC using IE, Firefox, and Safari
3.0.4, and it looks fine. The rollovers do not work for the client
in Safari though. She is using Safari version 2.0.4. Her system is
Mac OS X, version 10.4.8, 1.33 GHz powerPC G4.
I'm stumped. I'm using Dreamweaver CS3. Here's a link to one
of the pages with the issue:
http://www.leadtooth.com/pythagoras/filmwork.html
Any help would be incredible appreciated. Thanks in advance.
MattYou have munged your code. Change this -
<script language="JavaScript" type="text/javascript">
<meta name="coverage" content="Worldwide">
<meta name="country" content="Canada">
<meta name="revisit_after" content="14 days">
<meta name="robots" content="index, follow">
<meta name="distribution" content="global">
<meta name="rating" content="General">
<!--
function MM_reloadPage
to this -
<meta name="coverage" content="Worldwide">
<meta name="country" content="Canada">
<meta name="revisit_after" content="14 days">
<meta name="robots" content="index, follow">
<meta name="distribution" content="global">
<meta name="rating" content="General">
<script language="JavaScript" type="text/javascript">
<!--
function MM_reloadPage -
I've created a site in IWeb, when I publish to my local folder or the web, the rollovers in my navigation bar do not work. They used to work fine, until I added a few more pages to complete my site. My nav bar is a text box with my links inserted as text.
Any suggestions?
ThanksI see the rollover image that should come up . Since the rollover works locally the issue has to be with the uploading of the site files. How are you uploading the files?
If you're using iWeb try using a 3rd party FTP client like the free Cyberduck to upload the site folder and its index.html file to the server. -
Fonts changing and rollovers not working...
Can someone help me figure out why my fonts are changing and my rollovers are not working? I am publishing to a folder and then uploading to Godaddy's FTP. The site works and looks fine before I upload it, the problem only occurs once it's online.
That's understandable. There are a number of text boxes that are overlapping other text boxes and objects. That can cause IE to do strange things. Also make sure you're using Web Safe Fonts. On the green page you're using Bank Gothic which is not a web safe font. Computers that don't have that font installed will substitute a different font and it'll look much different than you intended.
Roddy's has some tips on making iWeb more friendly to IE: How to get your iWeb Site to load in Internet Explorer. -
Rollovers not working. Some do, some don't, they're identical!?
I've used this onmouseover set of code many times. Today I have 5 rollovers, two work and three just dont. Can't figure out why.
My About works, and my Contact works. But my Management and the Development and Implement don't work. ----?? A Javascript thing, JSLint, tells me there's a missing semicolon after the png on each line, but I've never used a semicolon there before. --? Once Len Hewitt found an ampersand in my meta tag or something like that, and it seemed to corrupt the page, or something, I've vague memory on that...
Thanks friends!Well, I found the culprit, although I don't comprehend it too well. It was a layer I was using to indicate the edges of each nav button, a png layer. The rollovers work without that layer, but not with it. On with the show...
-
Spry elements and rollovers not working in IE (all)
After updating my DW CS5.5 last week my rollovers and spry menu elements don't work in IE (any version). Everything worked well before update. It is not the code (ran it through validator). I tried just insert the elements to the empty page and nothing works. I really need this to resolve as my deadline is in 2 weeks. Is it any way how I coudl return to the previous version? My version now (after update) is Version 11.5 Build 5366.
I forgot to mention that also I cannot connect to Adobe Browser Lab from DW since update ( I can do it from website) - it doesn't recognize my Adobe ID.
Thank you to everybody who coudl give me some info
DanielaUpgrading should not be the cause of the problem.
If you want us to help you, please post a link to your site so that we can be privy to the same info that you have.
Gramps -
DVD menu button rollovers not working on PS3
I am totally new to Adobe Encore, and I tried to make my first DVD project yesterday. I used the default "Party" menu which I then edited in Photoshop to include my own graphic assets and text. The project is just two videos of a play that I recorded for a friend - one video is the Friday night performance and the other is the Sunday night performance. So there's only two buttons on the menu.
The DVD works fine on my Mac. The buttons do their rollover thing when I mouse over the two menu options. But on my PS3, the rollovers just don't appear. If I hit the X button when the menu appears, it plays the first video. If I hit the Down button first, and then the X buttons, it plays the second video, so obviously the function of the menu is working correctly, but the rollovers are not appearing.
Does anyone have any insight into what I might have done wrong?Welcome to the forum.
Not sure exactly how the PS3 handles Sub-picture Highlights (what appears in the Over/Selection state), as I have never used one.
To see the layout of the Menu better, can you post a screen-cap from Photoshop, with the Layers Palette open, and the Button Layer Set of one of those Buttons twirled open, and with the Visibility of the Sub-picture Highlight turned ON? That will give us the opportunity to see if something is wrong with the naming conventions of the Button Layer Set, and also see what the Highlight should look like in its rollover state.
If necessary, this ARTICLE will give you some tips on the screen-cap.
Good luck, and maybe a user, who knows the PS3 will drop by with a quick and easy "fix."
Hunt -
A:hover rollovers not working in IE
Hi all,
I've created two simple css rollovers for a basic navigation using an unordered list, and image replacement and a:hover. The rollover effect works fine in all modern browsers but not IE 6 + 7.
I can get a similar effect working in IE by substituting the unordered list with divs but can't figure out what I'm doing wrong with the unordered list.
Can anyone help please? The html and css is below:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Page title</title>
<link href="main.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper" class="container">
<div id="header">
<h1 class="logo">Title</h1>
<h2 class="subhead">Subtitle.</h2>
<div id="nav">
<h2>Need more information?</h2>
<h3>Look no further...</h3>
<ul>
<li id="nav-about"><a href="#about-div">About Us...</a></li>
<li id="nav-contact"><a href="#contact-div">Contact Us...</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>
/* CSS Document */
body {
font: 62.5% Helvetica, Arial, sans-serif;
text-align: center;
color: #000;
margin: 0px;
padding: 0px;
background:#faf9f2 url(im/background_texture_tile.jpg) top center repeat;
h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, form, fieldset, legend, blockquote, table { margin: 0; padding: 0; }
#wrapper {
text-align: left;
position: relative;
.container{
margin: 0 auto 50px;
width: 910px;
#header {
width: 870px;
height: 150px;
margin: 0 20px 0 ;
background: url(im/header-bg.gif) top left no-repeat;
h1.logo {
float: left;
height: 130px;
width: 315px;
margin: 0 0 0 50px;
border: 0;
outline: 0;
text-indent:-9999px;
display:block;
background:url(im/logo.png) 0 10px no-repeat !important;
background:url(im/logo.gif) 0 10px no-repeat;
display: inline;
h2.subhead {
font-weight: bold;
font-size: 1.6em;
line-height: 1.4em;
color: #999;
float: right;
width: 8.5em;
text-align: right;
margin: 40px 320px 0 0;
display: inline;
#nav {
position: absolute;
top: 0px;
right: 50px;
width: 270px;
height: 277px;
background: url(im/nav-bg.png) top left no-repeat;
#nav h2 {
text-align: center;
font: bold 1.6em Helvetica, Arial, sans-serif ;
color: #4D98C5;
margin-top: 35px;
#nav h3 {
text-align: center;
font: bold 2.2em Helvetica, Arial, sans-serif ;
color: #4D98C5;
padding-bottom: 13px;
margin: 0 40px 0;
border-bottom: 4.5px dotted #999;
#nav ul li {
list-style: none;
height:70px;
width: 190px;
display:block;
border-bottom: 4.5px dotted #999;
margin: 0 0 0 40px;
#nav ul li#nav-about a, #nav ul li#nav-about a:link, #nav ul li#nav-about a:visited {
border: 0;
outline: 0;
text-indent:-9999px;
padding: 60px 0 0px 0;
display:block;
background:url(im/about-btn.png) -10px -8px no-repeat !important;
background:url(im/about-btn.gif) -10px -8px no-repeat;
#nav ul li#nav-about a:focus, #nav ul li#nav-about a:hover, #nav ul li#nav-about a:active {
background:url(im/about-btn.png) no-repeat -10px -95px !important;
background:url(im/about-btn.gif) no-repeat -10px -95px;
#nav ul li#nav-contact a, #nav ul li#nav-contact a:link, #nav ul li#nav-contact a:visited {
border: 0;
outline: 0;
text-indent:-9999px;
padding: 60px 0 0px 0;
display:block;
background:url(im/contact-btn.png) -10px -8px no-repeat !important;
background:url(im/contact-btn.gif) -10px -8px no-repeat;
#nav ul li #nav-contact a:focus, #nav ul li#nav-contact a:hover, #nav ul li#nav-contact a:active {
background:url(im/contact-btn.png) no-repeat -10px -95px !important;
background:url(im/contact-btn.gif) no-repeat -10px -95px;
Many thanks in advance for looking,
Cheers,
Karl.For best cross browser results, use the following sequence when defining your links states:
a, link, visited, hover, active, focus.
#nav li a {text-decoration:none}
#nav li a:link {color:red} /**unvisited**/
#nav li a:visited {color:gray} /**visited**/
#nav li a:hover, /**on mouse over**/
#nav li a:active, /**on click**/
#nav li a:focus /**on click/tab key in IE**/
{text-decoration:underline}
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb
http://alt-web.blogspot.com -
Acrobat 7 button rollovers not working and crash acrobat
Indesign CS2 Acrobat 7
I have created in Indesign CS2 an interactive front page cotaining buttons with links to 5 documents. These 5 documents have buttons for next page, previous page etc. and a link back to the front page.
When these files are burnt to a CD and opened on certain pcs recently upgraded and CS2 reinstalled, the rollover buttons don't work and cause Acrobat 7 to crash. However on other pcs these files work fine.
My thought was the CS2 software that was reinstalled had been corrupted in some way, so this was installed again but the problem still remains.
THe odd thing is that interactive elements that were produced before the reinstall work fine.
Any suggestions are welcome on how to solve this problem.
Many Thanks,
TonyWelcome to the forum.
Not sure exactly how the PS3 handles Sub-picture Highlights (what appears in the Over/Selection state), as I have never used one.
To see the layout of the Menu better, can you post a screen-cap from Photoshop, with the Layers Palette open, and the Button Layer Set of one of those Buttons twirled open, and with the Visibility of the Sub-picture Highlight turned ON? That will give us the opportunity to see if something is wrong with the naming conventions of the Button Layer Set, and also see what the Highlight should look like in its rollover state.
If necessary, this ARTICLE will give you some tips on the screen-cap.
Good luck, and maybe a user, who knows the PS3 will drop by with a quick and easy "fix."
Hunt -
Rollovers not working in CS3 - HELP!
I imported a site into Dreamweaver, and on the pages I haven't touched the rollovers work fine. On the pages I've made changes, the rollovers no longer work although the links work. I tried replacing the head tag on the page with the disfunctional rollovers with the functional page to make sure the java script was working properly, but it still didn't work. I tried deleting an image and relinking the image for the rollovers, and it still doesn't work. I also tried putting the pages through a CSS editor and didn't find any errors. Here's a link to the functional page:
http://tscre.com/
AND a non-functional page:
http://tscre.com/services.htm
Can anyone help? THANKS!!!Your disfunctional pages have lost the carriage returns between adjacent lines of code in the head. This will impact the functionality of your javascript there.
Open the functional page, and copy everything from here -
<script language="JavaScript" type="text/JavaScript">
<!--
through here -
//-->
</script>
(including those lines of code)
And paste it over the corresponding parts of the non-functional pages. This target area will require some effort to find since all of the carriage returns have been stripped.
That should fix you up.
Murray -
Movieclip rollovers not working on different frames
I'm creating an interactive that consists of 3 maps, each on its own tab. On each map, there are various circles representing data for a particular city.I want the circles to display a pop-up containing text when you roll over each one. Since I don't want the plain old buttons, I'm using 2-frame movie-clips, where the second frame represents the mouse-over state and a text box fades in as follows:
mntextbox2.addEventListener(Event.ENTER_FRAME, fl_FadeSymbolIn_4);
mntextbox2.alpha = 0;
function fl_FadeSymbolIn_4(event:Event)
mntextbox2.alpha += 0.1;
if(mntextbox2.alpha >= 1)
mntextbox2.removeEventListener(Event.ENTER_FRAME, fl_FadeSymbolIn_4);
This all works fine, and I can get multiple buttons working on the first tab (frame 1) by grouping them all into a movie clip, as follows:
buttongroup.buttonMode = true
buttongroup.addEventListener(MouseEvent.MOUSE_OVER, onButtonOver);
buttongroup.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut);
function onButtonOver(e:MouseEvent):void
e.target.gotoAndStop(2);
function onButtonOut(e:MouseEvent):void
e.target.gotoAndStop(1);
The problem is when I try to use the same or a similar with a different set of buttons on the second tab (frame 15). I put a similar set of actionscript on frame 15. The buttons seem to accept the buttonMode = true command, but I absolutely cannot get the rollovers to display. I've tried using different function names for the MOUSE_OVER and _OUT events, to no avail. I get no errors and nothing shows up in Output -- it just acts as if there's no rollover to display.
Do I need to somehow put all the AS on Frame 1? Is it an issue related to ENTER_FRAME in the rollovers? Many thanks.Is there any relationship between buttongroup and mnbuttontab2?
The only code you should need in frame 15 for the rollover/out should be...
mnbuttontab2.buttonMode = true
mnbuttontab2.addEventListener(MouseEvent.MOUSE_OVER, onButtonOver);
mnbuttontab2.addEventListener(MouseEvent.MOUSE_OUT, onButtonOut);
as they should be able to use the same functions from frame 1 without rewriting them in frame 15.
Have you tried putting trace() calls in your event handler functions in frame 15 to see if the functions are getting called? -
Simple Flash rollovers not working in Director
I’ve taken the pre-made rounded VCR buttons from the
Flash library, placed them one at a time on a 30 x 24 stage and
published the swf. I’ve imported the swf’s into
Director but only the pause button executes the rollover. I can
double click on each of the swf’s and the rollovers work fine
but in Director the pause button is the only one working. I
can’t see any difference between the buttons, they’re
constructed exactly alike, anyone know what’s up?No code in the SFW's at all ... it really is just the stock
button thrown on the stage and exported (because I was too lazy to
draw them myself ;-) -
Why don't my rollovers appear in IE when they look fine in Firefox? Thanks.
I answered my own question...IE8 was blocking scripts and ActiveX from running. I allowed it and it worked.
-
Hi,
I have created a menu bar in Fireworks and imported into Dreamweaver - the menu previews fine in Fireworks but not Dreamweaver. The link is shown below:
http://www.bundalaguahcricketclub.com.au/
Any ideas?It is probably easier and more reliable to have text change colors by way of CSS rather than having your graphics editor do that. Put into your CSS file
a:link {
color: #FFF;/*white*/
a:visited {
color: #000;/*black*/
a:hover {
color: #FF0000;/*red*/
background-color: #FFF;/*white*/
text-decoration: none;
a:active {
color: #FFF;/*white*/
You can change them anyway you like, change the background color...etc
Gary -
Rollovers not working properly
Hey All,
I have created a layout in Photoshop cs5 and imported it into Fireworks cs5. I then duplicated the first state and turned on layers that represent an over state for buttons on a navigation bar. Then I added a simple rollover behavior to each individual slice containing those images. When I export the .htm file and open it up in any web browser, all of the slices change to the rollover state simultaneously no matter what slice I am rolling over. I am using Mac OSX 10.6.4 with the CS5 master collection fully updated. I have used Fireworks cs4 on a different computer following the same procedure and it works just fine. Is there a step or two that I am missing in the cs5 version?
Thanks in advance for any help!
-millfalc2000Hi Linda,
Thanks for your response. I seem to have figured out the problem. On a whim, I tried it again and it fixed itself. Although I don't know what I did different. I appreciate it anyway.
Thanks!
Maybe you are looking for
-
Hey everyone, I've been working on this for at least 3 hours. I have a WRT54G VER. 6 with the most updated firmware. When I get to the xbox 360, it is connected to the network, but it won't get an IP address. I need some help...
-
How can i create f4 functionality
Hi frds, My requirement is diff plant create diff report no , but all the plant are see all the report no. I want to prevent for every one plant that is one plant created report no not see other plant. Is it possible ,Pls suggest me. Thanks in advanc
-
Message Status "Scheduled", Queue Status "Queue Stopped"
Hi friends, My scenario is from Peoplesoft -> XI -> BI Message has reached BI, but in SXMB_MONI, its showing Message Status as "Scheduled" and Queue Status "Queue Stopped". How to proceed further ? How can I start that queue ? Thanks ain advance, Nee
-
Sad icon = computer does not detect = cannot put into disc mode !
hey, my ipod photo at the moment won't turn on. the best i can do is plug it in to either my pc or the electricity supply, or reset it, so the apple logo comes up, however it only lasts for a few seconds and the sad face icon appears, directing you t
-
HT1338 motion 4 will not work after yosemite upgrade
motion 4 will not work after yosemite upgrade