如何更改圖像src連同主題演講..？

<div id="div1" class="index-speaker-img"> 

<img id="image1" src="" onmouseout="hide(this,'keynote2')" onmouseover="show(this,'keynote2')" width="30%" class="fl"/> 

<div id="keynote2" class="tip1" style="display:none;top:22%;left:2%;" onmouseout="hidePop(this,'keynote6')" onmouseover="showPop(this,'keynote6')"> 
<p style="line-height:15px;font-size:19px;font-family:'Neo_Sans_Bold';color:#ffffff;">Venkat</p> 
      <p >Founder,Developer Inc.</p> 
      </div> 
</div > 

<div class="index-speaker-img"> 
<img id="image2" src="" onmouseout="hide(this,'keynote4')" onmouseover="show(this,'keynote4')" width="30%" class="fl"/> 

<div id="keynote4" class="tip1" style="display:none;top:22%;left:33%;" onmouseout="hidePop(this,'keynote6')" onmouseover="showPop(this,'keynote6')"> 
      <p style="line-height:15px;font-size:19px;font-family:'Neo_Sans_Bold';color:#ffffff;"> Mann</p> 
      <p >Editor-in Central</p> 
      </div> 
     </div >

和如何更改圖像src連同主題演講..？

JS文件

var images = [ 
    "http://static.ddmcdn.com/gif/lightning-gallery-18.jpg", 
    "http://static.ddmcdn.com/gif/lightning-gallery-19.jpg", 
    "http://static.ddmcdn.com/gif/lightning-gallery-20.jpg", 
    "http://static.ddmcdn.com/gif/lightning-gallery-17.jpg"]; 

function randImg() { 
    var size = images.length 
    var x = Math.floor(size * Math.random()) 
    document.getElementById('image1').src = images[x]; 
} 

window.onload = randImg;

及其變化圖像surce，但不與圖像一起改變其基調..提前感謝..........

額外............. http://jsfiddle.net/gFft7/20/

來源

2014-02-28 Nivin

您的目標是什麼？我認爲這可能會寫得比現在好很多。當主題演講顯示，並且他們將鼠標懸停在另一個主題演講上時？ – Adween

我仍然會說這裏有什麼地方是錯誤的，代碼需要重新編寫清晰定義的目標，但這會改變基調http://jsfiddle.net/gFft7/23/ – Adween

我會考慮重新編寫代碼你，但明確的目標，以獲得隨機基調與圖像加載，你可以做以下

HTML：

<img id="image" src="" width="30%" class="fl"/> 
<div id="keynote"></div>

然後的javascript：

var images = [ 
    { 
     "imagesrc": "http://static.ddmcdn.com/gif/lightning-gallery-18.jpg", 
     "keynotecontent": '<p style="line-height:15px;font-size:19px;font-family:\'Neo_Sans_Bold\';color:#000066;">Something</p><p>Test 1.</p>' 
    }, 
    { 
     "imagesrc": "http://static.ddmcdn.com/gif/lightning-gallery-19.jpg", 
     "keynotecontent": '<p style="line-height:15px;font-size:19px;font-family:\'Neo_Sans_Bold\';color:#666666;">Something else 1</p><p>Test 2.</p>' 
    }, 
    { 
     "imagesrc": "http://static.ddmcdn.com/gif/lightning-gallery-20.jpg", 
     "keynotecontent": '<p style="line-height:15px;font-size:19px;font-family:\'Neo_Sans_Bold\';color:#006600;">Something else 2</p><p>Test 3.</p>' 
    } 
]; 

function randImg() { 
    var size = images.length 
    var x = Math.floor(size * Math.random()) 
    document.getElementById('image').src = images[x].imagesrc; 
    document.getElementById('keynote').innerHTML = images[x].keynotecontent; 
} 

window.onload = randImg;

這裏是一個js撥弄執行以下代碼http://jsfiddle.net/gFft7/25/

來源

2014-02-28 10:52:09 Adween

如何更改圖像src連同主題演講..？

回答

相關問題