JQuery菜單問題

我有一個菜單。菜單選項卡是圖像。我希望圖片在點擊完成後發生變化。JQuery菜單問題

如果我點擊另一個選項卡上的圖像應該轉換爲舊的。我的想法是使用.addClass（）和.removeClass（）。

下面是HTML：

<div class="navigation"> 

     <ul> 
      <li id="1"> 
       <div id="menuImage1" class="menuImage"></div> 
       <div class="menuText"><p>1</p></div> 
      </li> 
      <li id="2"> 
       <div id="menuImage2" class="menuImage"></div> 
       <div class="menuText"><p>2</p></div> 
      </li> 
      <li id="3"> 
       <div id="menuImage3" class="menuImage"></div> 
       <div class="menuText"><p>3</p></div> 
      </li> 
      <li id="4"> 
       <div id="menuImage4" class="menuImage"></div> 
       <div class="menuText"><p>4</p></div> 
      </li> 
      <li id="5"> 
       <div id="menuImage5" class="menuImage"></div> 
       <div class="menuText"><p>5</p></div> 
      </li> 
      <li id="6"> 
       <div id="menuImage6" class="menuImage"></div> 
       <div class="menuText"><p>6</p></div> 
      </li> 
     </ul> 

    </div>

JQuery的（例如第一個菜單選項卡）：

$(".navigation li").click(function() { 
    $(".menuImage1").addClass('menuImageActive1'); 
    $(".menuImage1").not(this).removeClass('menuImageActive1'); 
});

請你能幫助我，因爲我的JavaScript並不好。

來源

2012-11-21 user1830414

寫你已經嘗試了JS – mram888

我認爲你正在尋找jquery mouseup（鼠標按鈕釋放）和mousedown（鼠標按鈕按下）功能。像

try代碼：

$(".menuImage").mousedown(function() { 
    $(this).addClass("class"); // new class on mouse button press 
}); 


$(".menuImage").mouseup(function() { 
    $(this).removeClass("class"); //remove class after mouse button release 
});

難道這就是你要找的人？

來源

2012-11-21 12:20:20

是的，這是偉大的。但如果點擊完成，我必須爲第三個圖像添加第三個類。如果我點擊另一個標籤，第三類必須刪除。 – user1830414

哦，你的意思是說只有一個'選定'的圖像，如果用戶選擇不同的圖像，以前'選擇'的圖像變得正常？ –

變化做如下...

<img id="menuImage1" src="oldurl" class="menuImage"></img>

js代碼

$("p").mousedown(function() { $('#menuImage1').attr('src',newurl); }); 
$("p").mouseout(function() {$('#menuImage1').attr('src',oldurl);});

來源

2012-11-21 12:21:24

JQuery菜單問題

回答

相關問題