首頁 考試吧論壇 Exam8視線 考試商城 網絡課程 模擬考試 考友錄 實用文檔 求職招聘 論文下載
2011中考 | 2011高考 | 2012考研 | 考研培訓 | 在職研 | 自學考試 | 成人高考 | 法律碩士 | MBA考試
MPA考試 | 中科院
四六級 | 職稱英語 | 商務英語 | 公共英語 | 托福 | 雅思 | 專四專八 | 口譯筆譯 | 博思 | GRE GMAT
新概念英語 | 成人英語三級 | 申碩英語 | 攻碩英語 | 職稱日語 | 日語學習 | 法語 | 德語 | 韓語
計算機等級考試 | 軟件水平考試 | 職稱計算機 | 微軟認證 | 思科認證 | Oracle認證 | Linux認證
華為認證 | Java認證
公務員 | 報關員 | 銀行從業(yè)資格 | 證券從業(yè)資格 | 期貨從業(yè)資格 | 司法考試 | 法律顧問 | 導游資格
報檢員 | 教師資格 | 社會工作者 | 外銷員 | 國際商務師 | 跟單員 | 單證員 | 物流師 | 價格鑒證師
人力資源 | 管理咨詢師考試 | 秘書資格 | 心理咨詢師考試 | 出版專業(yè)資格 | 廣告師職業(yè)水平
駕駛員 | 網絡編輯
衛(wèi)生資格 | 執(zhí)業(yè)醫(yī)師 | 執(zhí)業(yè)藥師 | 執(zhí)業(yè)護士
會計從業(yè)資格考試會計證) | 經濟師 | 會計職稱 | 注冊會計師 | 審計師 | 注冊稅務師
注冊資產評估師 | 高級會計師 | ACCA | 統(tǒng)計師 | 精算師 | 理財規(guī)劃師 | 國際內審師
一級建造師 | 二級建造師 | 造價工程師 | 造價員 | 咨詢工程師 | 監(jiān)理工程師 | 安全工程師
質量工程師 | 物業(yè)管理師 | 招標師 | 結構工程師 | 建筑師 | 房地產估價師 | 土地估價師 | 巖土師
設備監(jiān)理師 | 房地產經紀人 | 投資項目管理師 | 土地登記代理人 | 環(huán)境影響評價師 | 環(huán)保工程師
城市規(guī)劃師 | 公路監(jiān)理師 | 公路造價師 | 安全評價師 | 電氣工程師 | 注冊測繪師 | 注冊計量師
繽紛校園 | 實用文檔 | 英語學習 | 作文大全 | 求職招聘 | 論文下載 | 訪談 | 游戲
您現在的位置: 考試吧(Exam8.com) > 軟件水平考試 > 復習資料 > 網頁制作 > 正文

網頁特效:當你指向某個鏈接時,網頁中的圖片會自動跑過去

  當你指向某個鏈接時,網頁中的圖片會自動跑過去。要完成此效果把如下代碼加入到<body>區(qū)域中

  <style type="text/css">
  #divCircle   {position:absolute; width:10px; height:100px; z-index:1; top:-50px;}
  .clButtons   {position:absolute; width:50px; height:10px; top:20px;left:100px; visibility:hidden; z-index:10; font-family:新細明體; font-size:10pt;}
  .clButtons a   {   COLOR:#000080;   }
  </style>
  <script language="Javascript" type="text/javascript">
  function lib_bwcheck(){ //Browsercheck (needed)
   this.ver=navigator.appVersion
   this.agent=navigator.userAgent
   this.dom=document.getElementById?1:0
   this.opera5=this.agent.indexOf("Opera 5")>-1
   this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;
   this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;
   this.ie4=(document.all && !this.dom && !this.opera5)?1:0;
   this.ie=this.ie4||this.ie5||this.ie6
   this.mac=this.agent.indexOf("Mac")>-1
   this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;
   this.ns4=(document.layers && !this.dom)?1:0;
   this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)
   return this
  }
  var bw=new lib_bwcheck()
  numItems = 4
  circleXstart = 10
  circleYstart = -25
  circleXoffset = 5
  circleYoffset = -3
  circlePXspeed = 5
  circleTspeed = 10
  circleStay = 1
  function makeObj(obj,nest,x,y){
   nest = (!nest)?"":‘document.‘+nest+‘.‘
   this.css = bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+‘document.‘+obj):0
   this.evnt = bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?this.css:0
   this.showIt = b_showIt
   this.moveIt = b_moveIt
   this.slide = b_slide
   this.slideIt = b_slideIt
   this.obj = obj+"Object"
   eval(this.obj+"=this")
   return this
  }
  var px = bw.ns4||window.opera?"":"px";
  function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x+px; this.css.top=this.y+px;}
  function b_showIt(){this.css.visibility="visible"}
  function b_slideIt(endx,endy,inc,speed,fn,wh) {
   if (!this.slideactive) {
    var distx = endx - this.x
    var disty = endy - this.y
    var num = Math.sqrt(Math.pow(distx,2) + Math.pow(disty,2))/inc
    var dx = distx/num
    var dy = disty/num
    this.slideactive = 1
    this.slide(dx,dy,endx,endy,speed,fn,wh)
   }
  }|||  function b_slide(dx,dy,endx,endy,speed,fn,wh) {
   if (!fn) fn = null
   if (!wh) wh = null
   if (this.slideactive && (Math.floor(Math.abs(dx))<Math.floor(Math.abs(endx-this.x)) ||   Math.floor(Math.abs(dy))<Math.floor(Math.abs(endy-this.y)))) {
    this.moveIt(this.x+dx,this.y+dy)
    eval(wh)
    slidTim = setTimeout(this.obj+".slide("+dx+","+dy+","+endx+","+endy+","+speed+",‘"+fn+"‘,‘"+wh+"‘)",speed)
   }
   else{
   this.slideactive = 0
   this.moveIt(endx,endy)
   eval(fn)
   }
  }
  function slideballInit(){
   oBut = new Array()
   for (var i=0; i<=numItems; i++){
    oBut[i] = new makeObj(‘divButton‘+i)
   }
   oCircle = new makeObj(‘divCircle‘)
   oBut[0].moveIt(250,100)
   oBut[1].moveIt(310,100)
   oBut.moveIt(370,100)
   oBut.moveIt(420,100)
   oBut.moveIt(480,100)
   oCircle.moveIt(circleXstart,circleYstart)
   //Showing the buttons
   for(var i=0; i<=numItems; i++){
    oBut[i].showIt()
   }
  }
  var slidTim = 100;
  var active = -1
  function sbmover(num){
   clearTimeout(slidTim)
   oCircle.slideactive = false
   oCircle.slideIt(oBut[num].x+circleXoffset,oBut[num].y+circleYoffset,circlePXspeed,circleTspeed)
  }
  function sbmout(num){
   clearTimeout(slidTim)
   oCircle.slideactive = false
   if (active>-1 && circleStay) oCircle.slideIt(oBut[active].x+circleXoffset,oBut[active].y+circleYoffset,circlePXspeed,circleTspeed)
   else oCircle.slideIt(circleXstart,circleYstart,circlePXspeed,circleTspeed)
  }
  function changeListing(num){
   active = num
  }
  if(bw.bw) onload = slideballInit;
  </script>
  <div id="divButton0" class="clButtons">
  <a href="#" onmouseover="sbmover(0)" onmouseout="sbmout(0)" onclick="changeListing(0); return false">鏈接1</a>
  </div>
  <div id="divButton1" class="clButtons">
  <a href="#" onmouseover="sbmover(1)" onmouseout="sbmout(1)" onclick="changeListing(1); return false">鏈接2</a>
  </div>
  <div id="divButton2" class="clButtons">
  <a href="#" onmouseover="sbmover(2)" onmouseout="sbmout(2)" onclick="changeListing(2); return false">鏈接3</a>
  </div>
  <div id="divButton3" class="clButtons">
  <a href="#" onmouseover="sbmover(3)" onmouseout="sbmout(3)" onclick="changeListing(3); return false">鏈接4</a>
  </div>
  <div id="divButton4" class="clButtons">
  <a href="#" onmouseover="sbmover(4)" onmouseout="sbmout(4)" onclick="changeListing(4); return false">鏈接5</a>
  </div>
  <div id="divCircle">
  <img src="/soft/Files/2008-6/2/952484026.gif" width="22" height="21" border="0"  style="cursor: pointer" alt="點此在新窗口瀏覽圖片" onmousewheel="return bbimg(this)" onload="javascript:resizepic(this)" onclick="javascript:window.open(this.src);"  border="0"/>
  </div>

1 2  下一頁
文章搜索
軟件水平考試欄目導航
版權聲明:如果軟件水平考試網所轉載內容不慎侵犯了您的權益,請與我們聯(lián)系800@exam8.com,我們將會及時處理。如轉載本軟件水平考試網內容,請注明出處。