Trouble with mouseover

7 New Member

I am new to javascript and having a hard time. I have a class assignment that I have been working on for days...what has to happen is when the mouse rolls over the text an image is to appear. The code I have so far is as follows:

Expand|Select|Wrap|Line Numbers

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

  <head>

    <title></title>

    <script type="text/javascript" src="core.js"></script>

    <script type="text/javascript">

       function showMonkey()

       {
 
       }

    </script>

    <style>

      .hidden{display: none}

    </style>

  </head>

  <body>

  <h2>Adding Event Listeners</h2>

  <div>

    <h2 style="margin-right:300px">Mouse Here To See Monkey</h2>

    <img src="monkey.jpg" id="monkey" class="hidden" />

  </div>

  <script type="text/javascript">
 
var image = document.getElementById('monkey');
 
    if(document.attachEvent){

        image.attachEvent('mouseover',showMonkey);

    }

    else if(document.removeEventListener) {

        image.addEventListener('mouseover',showMonkey,false);

    }
 
 var class = Core.getElementsByClass('hidden');

Core.removeClass(class[0],'hidden');
 
  </script>

  </body>

</html>

If you have any questions please let me know..I have no idea what to add in the function.
Thanks in advance!

Nov 20 '09 #1

Subscribe Reply

1978

Dormilich

8,658

Recognized Expert Moderator Expert

@heapster123
well, obviously you have to make the image visible.

(enough hints for now)

btw. shouldn’t you mouse over the heading? or putting it that way: how to mouse over something that’s not there?

Nov 20 '09 #2

heapster123

New Member

Yes, I know I have to make it visible but HOW..what is the code?? I have searched and I am pulling my hair out!!
and another yes I want to mouse over the text but how do I use it if it has no ID...
don't be a tease....LOL

Nov 20 '09 #3

Dormilich

8,658

Recognized Expert Moderator Expert

@heapster123
find out, how you make it invisible (resp. what causes it to be invisible) and then do the opposite.

@heapster123
there are more ways to get an Element than it’s ID. check out the DOM for it.

Nov 21 '09 #4

acoder

16,027

Recognized Expert Moderator MVP

Why not give it an ID?

Also, you have the code to show, but it's in the wrong place - it needs to be in the function.

Nov 21 '09 #5

heapster123

New Member

I can't change the code...that would be too easy :)..part of the assignment.
I tried this but got nothing:
var heading = document.getEle mentByTagName(' h2').item(1);

Also if I move the if..if else to the function..I get nothing.

Do I need an "if" statement in the function to make the image visible on mouseover?

Thanks

Nov 21 '09 #6

Dormilich

8,658

Recognized Expert Moderator Expert

@heapster123
of course not, the function is called getElementsByTagName()

@heapster123
not necessarily (depends on what you want to do/test)

Nov 21 '09 #7

heapster123

New Member

ah of course....getEl ementsByTagName ()
what I want the function to do is show the image when the second h2 heading is rolled over.

Nov 21 '09 #8

Dormilich

8,658

Recognized Expert Moderator Expert

@heapster123
I don’t see a problem there.

Nov 21 '09 #9

heapster123

New Member

well, when I put this code in the function:

document.images['monkey.jpg'].style.visibili ty = visible;

the "monkey" is there. I need it to remain hidden until the heading is rolled over

You will be happy to hear I have ordered a beginners book from Amazon LOL

Nov 21 '09 #10

Similar topics

5498

Image Swap on Mouseover

by: OysterCracker | last post by:

Hi - I've previously used js to swap images on mouseover in a menu. I'm stumped on a different situation and would appreciate some advice. I would like to swap imageA to ImageB when I mouseover imageC. Also, swap imageA to ImageB when I mouseover a text link. How do I do those? Thanks, ~OC~

Javascript

1776

Javascript Mouseover Problem

by: richk | last post by:

For some reason when I add additional buttons a 3rd button and beyond i cant get the effect to work and I get errors...I cant understand why... <SCRIPT LANGUAGE = "javascript"><!-- if (document.images) { // Active Images img1on = new Image(); img1on.src = "button1_on.jpg";

Javascript

3346

Optimizing code for span mouseover invocation.

by: Alex | last post by:

On my page I have a lot string like this: <span onmouseover="callMe(this)" onmouseout="callMe(null)" >abc1</span> <span onmouseover="callMe(this)" onmouseout="callMe(null)" >abc2</span> <span onmouseover="callMe(this)" onmouseout="callMe(null)" >abc3</span> <span onmouseover="callMe(this)" onmouseout="callMe(null)" >abc4</span> How can I optimize it? Is it possible to move this definition what to do to style/css or some other common...

Javascript

5169

mouseover event in axWebbrowser kills navigation functions

by: Mitch | last post by:

I am hosting a web browser ctl in a container that implements the IDocHostUIHandler interface. I'm using this to control the context menu.This works fine. Then, I added a mouseover event to the document in the documentComplete event handler. When I add this event handler, I loose all other navigation functions in the browser! right click, left click, it's all dead. (The mouseover works though)

C# / C Sharp

19496

HTML image map mouseover help

by: Annette Acquaire | last post by:

I have and image map with a dozen hotspot links on it that I'm trying to get to open a new image over existing one on mouseover of each COORD. The only thing I was able to do was swap image on mouseover entire image, I want it on each hotspot only, so an image pertaining to each link shows up. I have done it in JavaScript, but the website I'm using doesn't use JavaScript. Y'all are obviously light-years more knowledgeable then me on html...

HTML / CSS

2751

Compounding MouseOver

by: Schannah | last post by:

I'm trying to create a design which mimics the Radiohead website in the action on this page, but the problem is that they use PHP for the effect and I have no idea about PHP. I'm very amateur: fairly confident with HTML and can scrape together codes with JavaScript with a lot of research and cursing, but for the life of me I can't see how to mouseover image or text A, get image or text B, mouseover B, get image or text C, and so on. I'm sure it...

Javascript

1957

mouseover only works correctly on second mouseover.

by: dave345 | last post by:

This javascript issue is in an app using C# / .Net 2.0 running on XP. First post, please mention if I mess up any conventions of this forum. I’ve got a mouseover event that only works properly the second time it fires if the page has been scrolled a lot. The mouseover displays an image in a div that is placed near the mouse cursor. When the rollover occurs near the bottom of the page, the coordinates are altered so that the entire image is...

Javascript

3014

slow response in table cells <TD> to mouseover with IE6 but fine inFirefox.

by: markszlazak | last post by:

I'm a relatively slow response of table cells changing their background color with mouseover/our in IE6 (Win 2K) but the response is fine (fast) in Firefox. Why? The code is below. Sorry about the length. <html> <head> <title>Rapid Blocking Interface</title> <style> .calendar {

Javascript

13348

trouble with tinyMCE images

by: matheussousuke | last post by:

Hello, I'm using tiny MCE plugin on my oscommerce and it is inserting my website URL when I use insert image function in the emails. The goal is: Make it send the email with the URL http://mghospedagem.com/images/controlpanel.jpg instead of http://mghospedagem.comhttp://mghospedagem.com/images/controlpanel.jpg As u see, there's the website URL before the image URL.

Javascript

8438

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...

General

8348

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...

Windows Server

8863

Problem With Comparison Operator <=> in G++

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...

C / C++

8549

The easy way to turn off automatic updates for Windows 10/11

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,...

Windows Server

6187

Access Europe - Using VBA to create a class based on a table - Wed 1 May

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...

Microsoft Access / VBA

5660

Couldn’t get equations in html when convert word .docx file to html file in C#.

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();...

C# / C Sharp

4186

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...

Networking - Hardware / Configuration

4356

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

2765

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

C# / C Sharp