将图像链接到网络链接

时间:2013-03-25 12:08:08

标签: javascript image hyperlink

首先,我不是网页设计师,我对html,css,javascript等知识非常有限。

我正在运行一个脚本,每次刷新页面时都会显示一个随机图像。我想知道,我如何设置点击链接,允许用户点击随机图像并进入另一个网页。

我正在使用的脚本如下。理想情况下,我希望能够点击图像,然后发送到该词的定义。

例如,当显示“expose.png”时,id就像能够点击图像并被带到http://oxforddictionaries.com/definition/english/expose?q=expose

请帮忙。

<a href="javascript:document.location.reload();"
ONMOUSEOVER="window.status='Refresh'; return true">
<img src="Graphic-design-can-[TEST].png" width="auto" height="auto"//>
</a>

</div>




<div id="outcome">

<script language="JavaScript">

function random_imglink(){
var myimages=new Array()

myimages[1]="expose.png"
myimages[2]="inform.png"
myimages[3]="explain.png"
myimages[4]="formulate.png"
myimages[5]="record.png"
myimages[6]="mediate.png"
myimages[7]="design.png"
myimages[8]="persuade.png"
myimages[9]="summarise.png"
myimages[10]="generate.png" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<img src="'+myimages[ry]+'" border=0>')
}
random_imglink()

</script>

2 个答案:

答案 0 :(得分:0)

你可以做类似的事情,与图像标签相同的程序,

<a href="javascript:document.location.reload();"
ONMOUSEOVER="window.status='Refresh'; return true">
<img src="Graphic-design-can-[TEST].png" width="auto" height="auto"//>
</a>

</div>

<div id="outcome">

<script language="JavaScript">

function random_imglink(){
var myimages=new Array()
var myurls=new Array()

myimages[1]="expose.png"
myimages[2]="inform.png"
myimages[3]="explain.png"
myimages[4]="formulate.png"
myimages[5]="record.png"
myimages[6]="mediate.png"
myimages[7]="design.png"
myimages[8]="persuade.png"
myimages[9]="summarise.png"
myimages[10]="generate.png" 

myurls[1]="http://google.com"
myurls[2]="http://stackoverflow.com"
.....
....


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href="'+myurls[ry]+'"><img src="'+myimages[ry]+'" border=0 id="'+myimages[ry]+'" onClick="'+dosomething(myimages[ry])+'") /></a>')
}

random_imglink()

function dosomething(myimage)
{
      switch(myimage)
      {
             case 'expose.png':
                     p = document.createElement("p");

                     img = document.createElement("img");
                     img.id="minutesTens";
                     img.src = "1.gif";
                     p.appendChild(img);
                     break;

             case 'inform.png':
                     p = document.createElement("p");

                     img = document.createElement("img");
                     img.id="minutesTens";
                     img.src = "2.gif";
                     p.appendChild(img);
                     break;
              case.....
              ..........
              ..........

 }

</script>

此代码说明了什么: 使用document.write函数创建的图像将包含ID和事件调用“onClick”。 将使用参数“ID”调用onClick()函数。将传递当前图像的ID。

dosomething()函数获取图像的ID,并根据switch case语句设置下一个图像。 我希望现在很清楚。 希望它有所帮助。

答案 1 :(得分:0)

你可以这样做......               

</div>




<div id="outcome">

<script language="JavaScript">

function random_imglink(){
var myimages=new Array()

var mylink = new Array()

myimages[1]="expose.png"
mylink[1]="www.atrein.com"
myimages[2]="inform.png"
mylink[2]="www.atrein.ir"
myimages[3]="explain.png"
mylink[3]="www.apadana-business.com"
myimages[4]="formulate.png"
mylink[5]="www.google.com"



var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href="'+mylink[ry]+'" ><img src="'+myimages[ry]+'" border=0> </a>')
}
random_imglink()

</script>