|
JavaScript - Image Onmouseover Problem
this is my script
Quote: <a href="javascript:void(0);" onmouseOver="hahaha()"> <img border="0" src="pink.gif" name="Mainpic" id="image"></a> and this is the function Quote: function hahaha() { document.getElementById('image').src="blue.gif"; } the problem is when i mouseover the image look like this why is that? help please! thanks Similar Tutorialshi, please ignore this thread..it is a duplicate of one already active. MODS please delete. apologies for my mistake. Hi, Im a complete newbie to javascript and I've basically copied and pasted the javascript I found here to use on my site. Its an onMouseOver slideshow: http://www.javascriptkit.com/script/...ifferent.shtml to use on my site. Basically, my problem is how do I add a second, separate image in a different location on the web page, associated with this script? If I post <a href="javascript:warp()"><img src="myimage" name="targetimage" border=0></a> in two different locations, which is the script for the image, the script stops working, but having it once makes it work. So how do I add two different image locations? Can someone please help me here? I just want to add more images in a different location. ie have image location 1, and image location 2. Thanks in advance Script Below: Code: <script>
function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink1
}
</script>
<script language="JavaScript1.1">
var myimages=new Array()
var gotolink="#"
function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}
preloadimages(my images here)
</script>
For the Links:
<a href="creativewriting.html" onMouseover="changeimage(myimages[1],this.href)">Creative Writing</a><br>
For the Image:
<a href="javascript:warp()"><img src="myimage" name="targetimage" border=0></a>
i am trying to use the most simple code i can to onmouseover of some text change 1 image. it will have multiple texts with different images for each one all displayed in one place. it seems to work well for me in IE, but on firefox the mouseover doesn't work. and on a mac it doesn't work in safari or firefox. any input is appreciated... here is the shortest version of the code i could put together. Code: <head>
<SCRIPT LANGUAGE="JAVASCRIPT">
<!--
function roll(img_name1, img_src1)
{
document[img_name1].src = img_src1;
}
//-->
</SCRIPT>
</head>
<body>
<a href="2_17_10/index.html" onmouseover="roll('poster','2_17_10/IMG_7075b.jpg')">2-17-10</a>
<img src="2_16_10/IMG_7072.jpg" name="poster" width=500></img>
</body>
</html>
HI, I am not very experienced with javascript and got stuck doing the following. I have placed some image rollovers on one of my pages..where when a user rolls over some text links..and image appropriate to that text is showen...when the mouse moves away from the links then a blank image is displayed as a place holder. this is all simple...here is where i am stuck. The place holder has a specific size...but the rest of the images that are displayed when the text is rolled over have different sizes, some are vertical some are hortizontal. i do not want to have to resize every image so that it properly fits the place holder...add the white borders and so on...so that the image is dispalyed properly. Is there a way to have the size be changed for each image...so that the size doesnt get inherited from the place holder, but so that the script applies the size associated with each individual image. example place holder is 20 x 20 image 1 is 100 x 200 image 2 is 200 x 100 the place holder is loaded...when the mouse moves over the first link...image 1 replaces the place holder...but instead of taking on the size of 20x20 it has to be displayed at its own size of 100 x 200... how can i do this? thank you for all of your help Is it possible to atchually make a javascript that onMouseOver an image expands a seperate image and also works multiple times? say from 1 px wide to 25px wide? It would be a great help if someone could help me with this one. Hi everyone. Can anyone help me , i need to make a onmouseover function , when u go with mouse on the left small image it automatically opens the large image in the right, can anyone help me with this ??? I have six small images. Depending on which image a user hovers over, I would like a seventh image (a simple box) to change as well. For example, if a user hovers over image1, I want the seventh image to be a red box. If a user hovers over image2, the seventh image should be a blue box. Simple huh? So the seventh image changes color based on which of the six smaller images the user hovers over. ------------- So far, my current code only allows me to hover over any of the six images, and the seventh image always changes to the same image color. Code is below. Any help would be appreciated. Code:
<script type="text/javascript">
function hoverBox() {
var boxNumber;
document.getElementById("info").src = "Images/infoRedColor.png";
}
function hoverBoxOut() {
document.getElementById('info').src = "Images/info.png;"
}
</script>
</head>
<body>
<div id="wrapper">
<a href=""> <img class="box1" src="Images/box1.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()"
onmouseout="this.src='Images/box1.png'; hoverBoxOut()" ></a>
<a href=""> <img class="box2" src="Images/box2.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()"
onmouseout="this.src='Images/box2.png'; hoverBoxOut()"></a>
<a href=""> <img class="box3" src="Images/box3.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()"
onmouseout="this.src='Images/box3.png'; hoverBoxOut()"></a>
<a href=""> <img class="box4" src="Images/box4.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()"
onmouseout="this.src='Images/box4.png'; hoverBoxOut()"></a>
<a href=""> <img class="box5" src="Images/box5.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()"
onmouseout="this.src='Images/box5.png'; hoverBoxOut()"></a>
<a href=""> <img class="box6" src="Images/box6.png" border="0" onmouseover="this.src='Images/box1hov.png'; hoverBox()"
onmouseout="this.src='Images/box6.png'; hoverBoxOut()"></a>
<!-- Seventh Image -->
<img id="info" src="Images/info.png" border="0">
</div>
</body>
Hi Guys. First off i'd like to say Hi as i'm new to the forums. But am looking forward to spending a lot of time here. I am currently studying Javascript to help create a bit more user interaction with my websites which I use CSS/XHTML and PHP5 to design. Ok with that said I was hoping someone might be able to lend a slight hand. I am trying to create an Image menu for a site I'm working on that is rather simple in essence. When the user hovers over a button I have the menu will move left or right depending. I have not got a great deal into it yet as I have become stuck, as I'm new I figured it would be easier to troubleshoot if I build up the program bit by bit. ----> menupic variable is being passed by php into javascript Code: function moveImagesLeft() {
for (i=0; i<=100; i++) {
setPixels = (i + 2);
for (L=1; L<=menuPic; L++){ /* this loop makes sure that all the pictures move together */
indexpic = "menupic"+L;
document.getElementById(indexpic).style.left="-"+setPixels+"px";
}
}
}
Ok, very simple. I have a DIV container that holds my images and the overflow is hidden, php works out how many images there are and feeds that into javascript. This all works fantastically however it seems that once I reach the bottom of my second for loop Code: document.getElementById(indexpic).style.left="-"+setPixels+"px"; Nothing else happens, the pictures all shift left 2pixels as they should but nothing else. The top loop is not going again (excuse the poor use of terminology) I dont know if it makes a different but where the images are they are declared as so. Code: <a href="#"><img class="menupic" id="menupic1,2,3,4,5 (etc)" src="_image" border="0" height="50" width="60"></a> Code: .menupic {position:relative; display:block; width:60px, height:40px}
and the Id class is there so that my javascript can control it. I hope that I have worded this in a way that is easily understandable. Any help would be greatly appreciated. I try not to ask for too much help because working things out is part of the learning curve but in this instance I have spent a lot of time and not found a solution. Kindest Regards Oli So I need to make a circular image map with a rollover state. I have circular buttons that I'm trying to put on my website, which I would like to not only look circular bu to BE circular. Because it just looks lame to hover over a square area and activate a button that's still 30 pixels away. I was digging through the Internets and found this: http://jsfiddle.net/7JJUk/ My idea was to tweak the rollover overlay into being as large as my original image and use the rollover image as the content of the overlay div. After loads of messing around, I finally have come to this: http://jsfiddle.net/7JJUk/248/ I just know i'm on to something, but I don't know anything, really, about Javascript. I've been messing with the tidbits to figure out what controls what, but the issue I can't get past is how the image will flicker like mad (every other pixel in Chrome, sporadically in Firefox 4 whether you move the mouse or not, and only as you pass through it at certain speeds in IE 9) as you hover over it. I have no idea if this is even possible, but if it is, please help me out. If there's a better way to be doing this altogether (without flash), I would absolutely love that. Especially if there's a way to use an image map with the position command in CSS.. Thanks!!! Hello all, I'm new to this forum so please forgive me if I make mistakes and feel free to point them out. I'm a beginner when it comes to javascript, but would like to learn. I have been building a website that I would like to put an interactive feature on. This is the code that I currently have: Code: <a href="javascript:void(0)" onclick="changeImg(white, 'images/Bouquet_pink.jpg')" onmouseover="scroll_up();"><img class="pinkico" hspace="3" onMouseover="this.style.opacity=1;this.filters.alpha.opacity=100;" onMouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50;" src="images/Bouquet_pink_icon.jpg"> <a href="javascript:void(0)" onclick="changeImg(white, 'images/Bouquet_yellow.jpg')"><img class="yellowico" hspace="4" onMouseOver="this.style.opacity=1;this.filters.alpha.opacity=100;" onMouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50;" src="images/Bouquet_yellow_icon.jpg"> <a href="javascript:void(0)" onclick="changeImg(white, 'images/Bouquet_white.jpg')"><img class="whiteico" onMouseover="this.style.opacity=1;this.filters.alpha.opacity=100;" onMouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50;" src="images/Bouquet_white_icon.jpg" ></a> I would like to have these images scroll together at the same time in accordance with the mouse movement. So when the mouse is just hovering over one of these images or elsewhere on my page they will stay still, but when the mouse is hovered over the left or the right hand side the images move in that direction? So if the mouse is hovering over to the left side the images will start to slide left and if the mouse is hovering over the right side the images will start to slide right. I have tried to do some research on this for myself but have only been able to locate this web page to explain what I am looking for: Link 1 - The type of effect I'm looking for is demonstrated by their first example, underneath the horizontal scrolling demo header. I have no idea how to achieve this code though and have failed to find any answers that I understand on the website. Adding two little arrow images for the mouseover and mouseout effect to happen would not be a problem, but I do not understand how to go about this. Hope this is ok, Thank you for reading , Nightshade14 I have an image map with 6 areas. Code: <p class="center"><img src="images/car_feature.png" alt="" usemap="#car"/></p> <map id="car" name="car"> <area shape="rect" coords="172,198,195,222" href="#" alt=""/> <area shape="rect" coords="242,79,266,104" href="#" alt=""/> <area shape="rect" coords="293,124,317,149" href="#" alt=""/> <area shape="rect" coords="407,212,431,227" href="#" alt=""/> <area shape="rect" coords="430,300,453,325" href="#" alt=""/> <area shape="rect" coords="565,346,588,370" href="#" alt=""/> </map> I also have 6 DIVs that are hidden and only a single one will appear visible on mouseover of its corresponding image map area. Code: <div id="hidden"> <div class="feature"> Feature 1 </div> <div class="feature"> Feature 2 </div> <div class="feature"> Feature 3 </div> <div class="feature"> Feature 4 </div> <div class="feature"> Feature 5 </div> <div class="feature"> Feature 6 </div> </div> The roadblock I'm running into is the show function in the JavaScript. Code: window.onload = init;
function init() {
var area = document.getElementById("car").getElementsByTagName("area");
var features = document.getElementById("hidden").getElementsByTagName("div");
hide();
function show() {
for(a=0; a < area.length; a++) {
if(area[a].onmouseover) {
document.getElementById("hidden").getElementsByTagName("div")[a].style.display="block";
}
}
}
function hide() {
for(b=0; b < features.length; b++) {
document.getElementById("hidden").getElementsByTagName("div")[b].style.display="none";
}
}
for(i=0; i < area.length; i++) {
area[i].onmouseover = show;
area[i].onmouseout = hide;
}
}
I'm trying to get it so that if I hover over the first area on the image map, the first hidden DIV will appear, but none of the others. And if I hover over the fourth area, the fourth DIV will appear. I hope this makes sense, and I'd appreciate any and all help towards solving this issue and ending my headache lol Hi guys, I need some help. Im trying to make a navagation menu with images that need to be changed when someone hovers over the child category. So lets say I have a menu that looks like this: Code: <img src="notactiveimagemenu1.jpg" alt=""> <ul id="menu1"> <li>link</li> <li>link</li> <li>link</li> </ul> <img src="notactiveimagemenu2.jpg" alt=""> <ul id="menu2"> <li>link</li> <li>link</li> <li>link</li> </ul> Now what im trying to do is if someone hovers over the li items from menu1 to change the image src of menu1.jpg to active. I was hoping to do this with some javascript. Code: // i was thinking about something like this: // first put menu items in a array // then use document.getElementById(id).onmouseover = function() // and make some sort of check to see which src should be changed. Now I really have no clue how to do it. So if anyone knows a cool solution please let me know. I know I could add onmouseover events to each li item and changing the src of the category. But Im trying to find a better solution. And I think I should be able to use document.getElementById(id).onmouseover = function() for that. Anyway thanks for any tips. Please note I know I could use jquery to do all of this very easy but I consider this practice because I don't know that much javascript. Hi I have a script that runs fine in FF, Chrome But in IE it does not work at all...(mouse over/mouseout) Would you please help me fix the problem... here is the code: Code: <script type="text/javascript">
var c=0;
var t;
var timer_is_on=0;
function timedCount()
{
document.getElementById('txt').value=c;
c=c+1;
t=setTimeout("timedCount()",1000);
}
window.onmouseout=doTimer;
function doTimer()
{
if (!timer_is_on)
{
timer_is_on=1;
timedCount();
}
}
function stopCount()
{
clearTimeout(t);
timer_is_on=0;
}
function descriptionKeyUp() {
if (timer === null) {
startTimer();
}
else {
clearTimeout(timestop);
}
timestop = setTimeout(stopTimer, 6000);
}
</script>
-----------------------
<form>
<textarea name="taskdesc" id="taskdesc" cols="45" rows="5"onmouseover="stopCount()" onkeyup="descriptionKeyUp()"></textarea>
<p>Time Spent on Other tasks:
<input type="text" name ="txt" id="txt" />
</p>
<p>Time Spent on Documenting:
<input type="input" name="seconds" id="timer" />
</form>
basically what it does is when user takes the mouse away from the form it counts the time...when user put the cursor in side the form...it stops counting...... 2 onmouseover conflict. i cant click menu1-jQuery. can someone help me out. Code: <!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>
<title>灰色CSS+Js实现的下拉菜单代码- www.webdm.cn</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script language="JavaScript" type="text/javascript">
function $(id){
return document.getElementById(id);
}
function menu_my(name,num) {
var my;
my = $(name);
if ( my.last == undefined ) {
my.last = 1;
}
var Menu = $("Menu" + name + my.last);
var Cont = $("Cont" + name + my.last);
Menu.className = "";
Cont.style.display = "none";
var Menu = $("Menu" + name + num);
var Cont = $("Cont" + name + num);
Menu.className = "selectd";
Cont.style.display = "block";
my.last = num;
}
</script>
<script type="text/javascript">
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;
</script>
<style type="text/css">
body{
text-align: center;
font-size:12px;
}
#popimg{
WIDTH:770px;
margin:0 auto;
text-align:center;
}
#popimg2{
WIDTH:770px;
margin:0 auto;
text-align:center;
z-index:-1;
}
ul {
padding: 0;
margin: 0;
list-style: none;
}
li {
position:relative;
float: left;
width: 110px;
}
li ul {
position:absolute;
display: none;
top: 20px;left:0;
}
li:hover ul, li.over ul {
display: block;
}
ul li a{
display:block;
font-size:12px;
border: 1px solid #ccc;
padding:3px;
margin-right:1px;
text-decoration: none;
color: #777;background:#eee;
}
ul li a:hover{
background-color:#f4f4f4;
}
#test{
clear:both;
background-color:#999999;
width:769px;
height:100px;
margin:0 auto;
}
.menu0307 {
OVERFLOW: hidden; ZOOM: 1; HEIGHT: 28px
}
.menu0307 SPAN {
BACKGROUND: url(http://upload.ouliu.net/g/ad2da94515010b2c275a9b4958441e20.png) no-repeat -1000px 0px; FLOAT: left; OVERFLOW: hidden; WIDTH: 125px; LINE-HEIGHT: 300px; HEIGHT: 28px
}
.menu0307 SPAN#Menuxuehua1 {
BACKGROUND-POSITION: 0px 0px
}
.menu0307 SPAN#Menuxuehua2 {
BACKGROUND-POSITION: -125px 0px; WIDTH: 124px
}
.menu0307 SPAN.selectd#Menuxuehua1 {
BACKGROUND-POSITION: 0px -32px
}
.menu0307 SPAN.selectd#Menuxuehua2 {
BACKGROUND-POSITION: -125px -32px
}
</style>
</head>
<body>
<div id="popimg">
<ul id="nav">
<li><a href="">menu1</a>
<ul>
<li><a href="/">Ajax/JavaScript</a></li><li><a href="/">ExtJS</a></li><li><a href="/">jQuery</a></li>
</ul>
</li>
<li><a href="">menu2</a>
<ul>
<li><a href="/">test1</a></li><li><a href="/">test2</a></li><li><a href="/">test3</a></li>
</ul>
</li>
<li><a href="">Ajax</a>
<ul>
<li><a href="/">CSS</a></li><li><a href="/">HTML</a></li><li><a href="/">editor</a></li>
</ul>
</li>
<li><a href="">menu3</a>
<ul>
<li><a href="/">media</a></li><li><a href="/">object</a></li><li><a href="/">graphic</a></li>
</ul>
</li>
<li><a href="">menu4</a>
<ul>
<li><a href="/">Ajax/JavaScript</a></li><li><a href="/">ExtJS</a></li><li><a href="/">jQuery</a></li>
</ul>
</li>
<li><a href="">menu5</a>
<ul>
<li><a href="/">game</a></li><li><a href="/">programming</a></li><li><a href="/">sale</a></li>
</ul>
</li>
<li><a href="">VC++</a>
<ul><li><a href="/">database</a></li><li><a href="/">oracle</a></li><li><a href="/">sql</a></li>
</ul>
</li>
</ul>
</div>
<div id="popimg2">
<div id="test">
<DIV class=menu0307 id=xuehua>
<SPAN class=selectd id=Menuxuehua1 onmouseover="menu_my('xuehua',1)" ;>meeting</SPAN>
<SPAN id=Menuxuehua2 onmouseover="menu_my('xuehua',2)" ;>note</SPAN>
</DIV>
<DIV id=Contxuehua1 style="POSITION: relative">test</DIV>
<DIV id=Contxuehua2 style="DISPLAY: none">database</DIV>
</div>
</div>
</body>
</html>
Heyho. Well I'm rather new to JavaScripting, so don't be harsh on me . Well I'm trying to make a 'onMouseOver & onMouseOut' event, where you hold the cursor over a image, it will change to another. So, here is my code: Code: <A HREF="Home.html" onmouseover="document.but.src='HOME_OVER.PNG'" onmouseout="document.but.src='HOME_BASE.PNG'"> <IMG SRC="Home_BASE.PNG" NAME="but" BORDER="0" ALT="..."> </A> <br> <A HREF="http://city-driving.co.uk" onmouseover="document.but.src='FORUM_OVER.PNG'" onmouseout="document.but.src='FORUM_BASE.PNG'"> <br> <IMG SRC="FORUM_BASE.PNG" NAME="but2" BORDER="0" ALT="..."> </A> It works fine when I use it for 1 picture, but it really mess up when I use it more then 1 time :/. I don't understand why. Probably obvious for you! Looking forward to (hopefully) see a solution . Marius. http://www.primedesigning.com/ellis/ I'm working on a site for a friend and I can't figure out what's causing this blinking! Hover over one of the 3 pictures in the "Products" section to see what I'm talking about (the larger, expanded picture and its border blinks on and off). BTW, this site is still under construction. Any design ideas you guys may have would be appreciated too Thanks for any help! hi i have a problem coding a menu i have 4 links on menu and clicking on items should expand a DIV and change the menu item image. also rollover has to change the image too i mean 3 conditions for every menu item: normal, rollover, clicked. i have no problem with rollover but when item is been clicked and image changes, image has to change on mouse over again, but has not to change to original image on mouse out. also clicking on another menu item has to change the previous item image to original. i'm confused enough i tried by samples over and over. but the main problem is that i dont know js syntaxes and coding however, anybody could help??? So i've written abit of code myself in order to do this: I will have multiple video tags on my website, each of the video tag's will have to be able to play/pause seperatly, so technically speaking only 1 video should be playing at a time, when the user 'onmouseout' it should pause and when the user's gos to another video that other video should start playing. If he move's the cursor out of the video it should stop... The problem is now, i have video A & B. When i go 'onmouseover' video B, video A starts playing. This is how i started coding: 1 . 2 functions for playing/pausing a video tag 2 . Check how many <video> tags are on the page (after load) 3 . Add Event "mouseout" + function to each <video> tag And the actual code: Javascript: Code: /*** FUNCTIONS OM DE MOUSEOVER & OUT TE DOEN WERKEN ***/
function speelFilmpje(){
document.getElementById("filmpke").play();
}
function stopFilmpje(){
document.getElementById("filmpke").pause();
}
window.onload = function(){
/*** FUNCTION DIE ONMOUSEOVER & OUT FUNCTIE AAN 'VIDEO' TAGS TOEVOEGT ***/
var video = document.getElementsByTagName('video');
var videotags = video.length;
//console.log(videotags);
for(i=0; i<videotags;i++){
video[i].addEventListener("mouseover", speelFilmpje,false);
video[i].addEventListener("mouseout", stopFilmpje,false);
}//einde van de functie
}
HTML: Code: <div id="right_column">
<div id="preview1">
<video width="197" height="81" id="filmpke">
<source src="unknown.ogg" type="video/ogg">
<source src="unknown.mp4" type="video/mp4">
</video>
<a href="#">Unknown (2010)</a>
</div>
<div id="preview1">
<video width="197" height="81" id="filmpke">
<source src="unknown.ogg" type="video/ogg">
<source src="unknown.mp4" type="video/mp4">
</video>
<a href="#">Unknown (2010)</a>
</div>
</div>
Any thoughts or information is welcome. I've stumbled upon my own wall of "Lack of knowledge" -_- Hey everyone, I'm trying to make a sound by using the mouseover event on JS. The script works fine on my husband's computer (IE8, windows xp), but does not work on mine (IE8, Vista). Click on the link below to give you an idea. Just mouseover the images and you should hear an elephant and duck sound. Mouseover the word "elephant" and it "should" make an elephant sound. http://www.mypreciousarrival.com/Ani...oundtest4.html I just need to find a script that will work with different operating systems (or at least windows xp and vista) and browsers (or at least IE) Any suggestions are greatly appreciated. I would like to not resort to any macromedia or schockwave scripting. Thank you! So I have been struggling with a Javascript issues for a couple of days now and can't find an answer anywhere online that has helped. I have a javascript loop that is looping through all of my <dfn> html tags. These tags are used to show a glossary term on my page. When the user mouses over the term it shows a popup with the term name and the definition. Here is my javascript function: Code: function definitionRollover(){
var j;
var dfns = document.getElementsByTagName('dfn')
for (j=0; j<dfns.length;j++){
var term = dfns[j].innerHTML.charAt(0).toUpperCase() + dfns[j].innerHTML.slice(1);
var definitionArray = new Array(term, dfns[j].title);
dfns[j].onmouseover = function(){stm(definitionArray,Style[0])}
dfns[j].onmouseout = function(){htm();};
}
}
As you can see I am adding a onmouseover event to these <dfn> tags which calls another function (stm) with the definition and term being held in the definitionArray. This works great until I have multiple terms on a page. When I have multiple terms it only shows the last terms definition for all terms. My question is how I can get it to work for all terms. I know that throughout the loop the definitionArray is holding the correct info at the correct time but for some reason it only shows the last one. I hope that this makes sense and if anyone could give me any tips or leads it would be very much appreciated. |
|||||||