на кнопке click display hidden div и изменить изображение?

Question

<div class="mac_1 tab_1 ipad_1" style=" float:right; margin:10px 20px 0 0;border:1px solid red; display: none;"></div> 
    <img src="images/mackbook.png" id="image"/> 
    <a href="#" id="mac" class="button facebook" style="width:120px; padding: 10px 0px; float:left; font: bold 22px 'Open Sans', sans-serif Helvetica, Clean, sans-serif;" OnClick="action();">Mackbook</a>  
    <a href="#" class="button facebook" style="width:80px; padding: 10px 0px; float:left; font: bold 22px 'Open Sans', sans-serif Helvetica, Clean, sans-serif;" OnClick="action1();">Tablet</a> 
    <a href="#" class="button facebook" style="width:80px; padding: 10px 0px; float:left; font: bold 22px 'Open Sans', sans-serif Helvetica, Clean, sans-serif;" OnClick="action2();">iPad</a> 
</div> 

Как показать div .mac_1 и изменить источник изображения при нажатии кнопки.

Answer 1

Попробуйте с этим JQuery сниппета:

$(document).ready(function(){ 
    $("#button").click(function(){ 
     $(".mac_1").css("display","block"); 
     $("#image").src("yourSource"); 
    }); 
}); 

Предполагая, что вы хотите изменить ГКЗ #image изображения, и показать свою обертку Див .mac_1.

UPDATE

Было бы лучше, чтобы разместить встроенные стили к классу «шоу» в CSS файле. Тогда вы могли бы пойти:

... 
$(".mac_1").addClass("show"); 
... 

бы быть лучшим подходом.