473,403 Members | 2,359 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,403 software developers and data experts.

Change href using a function.

Ben
Hi.
I have a button that change a number of images src's when I click a
button. The src's are stored in an array and I just use
document[imgName1].src=pics[0] to change the src of the image.
However I want the button to change the link as well to the image that
is displayed but i cannot get it to work. How do I do this. Could
someone tell me or point me in the direction of some code that will do
this.

I would like to do it in a similar way to the pictures. i.e. have all
the links stored in an array and change them when the button is
pressed.

Thanks for your time.

Ben.
Jul 23 '05 #1
2 9510
In article <c2**************************@posting.google.com >, bs2k1
@excite.com enlightened us with...
Hi.
I have a button that change a number of images src's when I click a
button. The src's are stored in an array and I just use
document[imgName1].src=pics[0] to change the src of the image.
However I want the button to change the link as well to the image that
is displayed but i cannot get it to work. How do I do this. Could
someone tell me or point me in the direction of some code that will do
this.

I would like to do it in a similar way to the pictures. i.e. have all
the links stored in an array and change them when the button is
pressed.

Thanks for your time.

Ben.


Perhaps a modification of my rotator script might help you.
(tested in Firefox 1.0 and MSIE 6 only)

/* image rotator script */

/* The array is a 2 dimensional construct with the image name as the first
part and the link as the second part.
Add image and link in brackets. Separate with commas.
i.e.
["imagename","url"],
["imagename2","url2"]

Note that the pages that use this script must have one and only one
image with the id of "rotator".
Browser support required: document.getElementById.
URLS MUST BE FULL ADDRESSES
*/

rotatorArray = [
["banners/ACF28E9.gif", "http://click.linksynergy.com/fs-bin/click?
id=xEiUbjZNzhI&offerid=35971.10000004&type=4&subid =0"],
["banners/hmp.gif", "http://www.localhomesforsale.com/hmp_index.cfm"],
["banners/harmon_banner.gif", "http://www.harmonhomes.com"],
["banners/ACF24D.jpg", "http://www.callcapture.com"]
]

var numImages = rotatorArray.length;
var delay = 4000; // default

var index = 0;
function rotate()
{
if (document.getElementById)
{
index ++;
if ( index >= numImages )
index = 0;
var e = document.getElementById("rotator");
// we do it this way so people with tabbed browsers can open in
a new tab by middle clicking, i.e. real link, not just an onclick event
e.innerHTML = "<a href='" + rotatorArray[index][1] + "'
target='_blank'><img src='" + rotatorArray[index][0] + "' alt='banner ad'
width='234' height='60' border='1'></a>";
}
setTimeout("rotate()", delay)
}
--
--
~kaeli~
If the funeral procession is at night, do folks drive with
their lights off?
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #2
Lee
Ben said:

Hi.
I have a button that change a number of images src's when I click a
button. The src's are stored in an array and I just use
document[imgName1].src=pics[0] to change the src of the image.
However I want the button to change the link as well to the image that
is displayed but i cannot get it to work. How do I do this. Could
someone tell me or point me in the direction of some code that will do
this.

I would like to do it in a similar way to the pictures. i.e. have all
the links stored in an array and change them when the button is
pressed.


This example uses the onclick event handler of the image, rather
than a link with an href attribute, and so it requires reasonably
modern browsers. Even if that's not directly useful to you, you
might be able to use the array of objects:

<html>
<head>
<script type="text/javascript">

function newImage(src,width,height) {
var img=new Image(width,height);
img.src=src;
return img;
}

pics = [
{
img : newImage("http://azphx.com/dhtml/tmp/alpha6464.jpg",64,64),
href : "http://www.google.com"
},
{
img : newImage("http://azphx.com/dhtml/tmp/beta6464.jpg",64,64),
href : "http://www.yahoo.com"
},
{
img : newImage("http://azphx.com/dhtml/tmp/gamma6464.jpg",64,64),
href : "http://www.cnn.com"
}
];
pics.position=0;

function nextImage(id) {
pics.position++;
pics.position%=pics.length;
document.getElementById(id).src=pics[pics.position].img.src;
}

</script>
</head>
<body>
<img id="dynamic"
src="http://azphx.com/dhtml/tmp/alpha6464.jpg"
onclick="location=pics[pics.position].href";
border="0"
width="64"
height="64">
<br>
<button onclick="nextImage('dynamic')">Change Image</button>
</body>
</html>

Jul 23 '05 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
by: Irvin Amoraal | last post by:
I am new to javascript coding. I am using some javascript code to change an image on an html page. I would like the user to click on the image to bring them to another page. I need to change an...
1
by: Bryan | last post by:
Hi, I have a form that I want to click a button on and cause the location.href to change. this is what I used: the function: function testform(){ location.href="http://www.google.com" }
4
by: Richard Cornford | last post by:
For the last couple of months I have been trying to get the next round of updates to the FAQ underway and been being thwarted by a heavy workload (the project I am working on has to be finished an...
5
by: Mel | last post by:
can someone post a simple javascript to change the text of the <href> for me ? thanks
3
by: FAQ server | last post by:
----------------------------------------------------------------------- FAQ Topic - I have window.status="Moomin"; why doesn't the statusbar change?...
4
by: Jo Claes | last post by:
Hi, A friend asked me if i could help him building a lilttle website. Having 10 years of proffessional experiance in writing "non-webbased" code i thought that will not be that hard. I think...
2
by: br4t | last post by:
Hi there. Currently encountering slight problems regarding a bit of javascript im using on a page im designing. Must warn though that my scripting skills are rather neglectable.... Im using this...
5
by: thatcollegeguy | last post by:
Below are my 3php and 2js files. I create a table using ajax/php and then want to change the values in the tables add(+ number for teamid) id's for each specific td in the table. I don't know...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
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,...
0
jinu1996
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...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
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,...
0
isladogs
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...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.