I want the text to change from gray to bright red when the mouse is moved over the name of our company. Here is the code that doesn't work. What do I need to change to make this work? -
function mouseOver(){
-
document.getElementById('unitedBrokers').style.font="size='2' face='Arial color='#FF0000'";
-
}// mouseOver()
-
-
function mouseOut(){
-
document.getElementById('unitedBrokers').style.font="size='2' face='Arial color='#808080'";
-
}// mouseOut()
-
-
<a id="unitedBrokers" onmouseover="mouseOver()" onmouseout="mouseOut()" style="text-decoration: none">United Brokers Incorporated</a>
-
19 16135 Dormilich 8,658
Recognized Expert Moderator Expert
your CSS declaration (syntax) is wrong.
you could avoid javascript (except for IE) by using the CSS pseudo-class :hover. - #unitedBrokers:hover {
-
font-family: Arial;
-
/* more settings go here */
-
}
you can also enhance your code by using the "this" keyword: - <a id="unitedBrokers">United Brokers Incorporated</a>
-
<script type="text/javascript">
-
function mouseOver()
-
{
-
this.style.font = "Arial";
-
}
-
function mouseOut()
-
{
-
this.style.font = "Helvetica"; // just as example
-
}
-
var ub = document.getElementById('unitedBrokers');
-
ub.addEventListener("mouseover", mouseOver, false);
-
ub.addEventListener("mouseout", mouseOut, false);
-
</script>
When I tried your second example I got the error "ub" is null or not an object. -
ub.addEventListener("mouseover", mouseOver, false);
-
-
Any idea what's wrong?
Here is exactly what I put in the header -
<script type="text/javascript">
-
function mouseOver(){
-
this.style.font.color = "#FF0000";
-
}
-
function mouseOut(){
-
this.style.font.color = "#808080";
-
}
-
var ub = document.getElementById('unitedBrokers');
-
ub.addEventListener("mouseover", mouseOver, false);
-
ub.addEventListener("mouseout", mouseOut, false);
-
</script>
-
Dormilich 8,658
Recognized Expert Moderator Expert @andersond
yup, you tried to access an element, that was not yet loaded. you need to wait 'til the page finished loading.
How do I do wait until the page is loaded?
Dormilich 8,658
Recognized Expert Moderator Expert @andersond - window.addEventListener("load", chainLoader, false);
-
// chainLoader() (custom function) holds all functions executed at start-up
The error this time is "chainLoade r not defined.
Dormilich 8,658
Recognized Expert Moderator Expert
as said in the hint "(custom function)" you have to define chainLoader() yourself.
Woops! My brain is asleep
This line: -
window.addEventListener("load", chainLoader, false);
-
produced this error:
'object doesn't support this property or method'
Here is my chainLoader() function: -
function chainLoader(){
-
mouseOver();
-
mouseOut();
-
document.screenOne.pState.focus();
-
}
-
I placed it in the opening line of the body -
<body topmargin="0" onLoad="chainLoader()" style="text-align: right">
-
and this line -
this.style.font.color = "#FF0000";
-
produced the error: 'this.style.fon t" is null or not an object
Sign in to post your reply or Sign up for a free account.
Similar topics |
by: Tim |
last post by:
Hope someone in the big wide world can help...
What I want to do is have an image slideshow which automatically
scrolls through a series of images very fast, then pauses when you
move your mouse over the image. The images will flick through (at a
rate of about 5 per second) then pause when the user onMouseOver's.
Any help would be gratefully received.
:o)
|
by: CQMMAN |
last post by:
Hello,
I am trying to change a piece of text using onmouseover. I have tried a few
things so far and nothing has really worked. I get get a new piece of text
to appear but bastardizing someone elses code, but can't figure out how to
hide the other one....
I sort of have the following but don't know if this is close to the best way
of doing it really...
|
by: Richard |
last post by:
I know I can have like <a href="#" onclick="dothis" onmouseover="dothat">
But how do you properly code two mouseover's in one statement?
<a href="#" onmousever="dothis" onmouseover="dothat">
As an example of use:
Column A holds menu items.
When a mouse over is performed, two actions take place instead of one.
Action one sends an image to a division in column B, action two sends text
to another division in column B.
|
by: Epetruk |
last post by:
Hi all,
I want a page where the contents of a table cell are replaced with an image
when the mouse moves over the cell, and the text is restored when the mouse
moves out. Here's the html for the page:
<HTML>
<HEAD>
<style type="text/css">
|
by: Martin Chen |
last post by:
I have a frame set (as per MS FrontPage 2000). It has a contents and a main
frame. The contents frame has a menu bar written with with javascript (in
the context of a table). In IE6.1 everything works fine as it also does in
firefox if I call the contents frame directly (i.e. outside of its
frameset). However, if I call my main page (index.html) which invokes the
frame set, the contents frame javascript menubar onmouseover function...
| |
by: drjackk |
last post by:
Hello,
I'm trying to change the onmouseover event dynamically.
This sets-up the initial onmouseover event:
<a href="home.html"> <img border="0" id="img22"
src="images/home1.jpg" height="15" width="85" alt="Home"
onmouseover="FP_swapImg(1,0,/*id*/'img22',/*url*/'images/home2.jpg')"</a>
|
by: Rob R. Ainscough |
last post by:
I'm using .NET v1.1 with ASPX web page.
I'm trying to have a RollOver hyperlink that will change images on an image
control and update the text in a Label control. I've got the image swapping
working, however I don't know how to get my Label control text to change
with the onMouseOver event
HTML...
</asp:hyperlink><asp:hyperlink id="lnkImageS" style="Z-INDEX: 113; LEFT:
|
by: Vear |
last post by:
Hi,
I'm looking to change the cssclass on a hyperlink with the onmouseover. I've
tried the 3 syntax's below but to no success. Can someone point me in the
right direction.
Thanks
HyperLink1.Attributes.Add("onmouseover", "this.ClassName='hover'")
HyperLink1.Attributes.Add("onmouseover", "this.CssClass='hover'")
HyperLink1.Attributes.Add("onmouseover", "this.Class='hover'")
|
by: den2005 |
last post by:
Hi everybody,
I am confused and still looking why this codes is not working. Can anyone notice or know why this code is not working? Thanks in advance.
Code working:
<form id="form1" runat="server">
<div>
</div>
<div>
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed.
This is as boiled down as I can make it.
Here is my compilation command:
g++-12 -std=c++20 -Wnarrowing bit_field.cpp
Here is the code in...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth.
The Art of Business Website Design
Your website is...
| |
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own....
Now, this would greatly impact the work of software developers. The idea...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert into image.
Globals.ThisAddIn.Application.ActiveDocument.Select();...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...
| |