View Full Version : beginner: getting position of item in array on mouseover

11-21-2012, 12:12 PM
Hi, I am trying to make it so that when you hover over a specific image, the script grabs the title from that image and places it in a paragraph. At the moment, nothing happens when I hover over any image. I don't fully understand why it's not working but my guess would be it's because I should of specified the img position on mouseover (getImgs[x].onmouseover= imgOnHover;). How do I get the position of the item in that array that's being hovered over? is there a better way to write this code without changing the HTML?

function init() {
var holder = document.getElementById("holder");
var getImgs = holder.getElementsByTagName("img");
var placeHere = document.getElementById("insert_here");

for(x=0; x<getImgs.length; x++){
getImgs[x].onmouseover= imgOnHover;

function imgOnHover() {
var getTitle = getImgs[x].title;
placeHere.innerHTML = getTitle;


window.onload = init;
<div id="holder">
<img src="image.jpg" title="one">
<img src="image.jpg" title="two">
<img src="image.jpg" title="three">
<img src="image.jpg" title="four">
<img src="image.jpg" title="five">
<img src="image.jpg" title="six">
<img src="image.jpg" title="seven">
<p id="insert_here"></p>

11-21-2012, 12:22 PM
Magic keyword: "this"

function imgOnHover() {
var getTitle = this.title;
placeHere.innerHTML = getTitle;

11-21-2012, 12:33 PM

thank you lol

Philip M
11-21-2012, 01:10 PM
<script type = "text/javascript">
function getTitle(which) {
var t = which.title;
alert (t);

<div id="holder">
<img src="image.jpg" title="one" onmouseover = "getTitle(this)">
<img src="image.jpg" title="two" onmouseover = "getTitle(this)">