Доброго времени суток. Есть панель которая при нажатии на кнопку выезжает из верхней границы сайта. В этой панели статично прописан текст. Нужно добиться такого эффекта: 3 кнопки при нажатии на которые выезжает панель, при нажатии на одну кнопку выезжает панель с одним текстом, при нажатии на вторую со вторым текстом, при нажатии на третью с третим текстом.
Код:
<script type="text/javascript">
$(document).ready(function() {
$(".topMenuAction").click( function() {
if ($("#openCloseIdentifier").is(":hidden")) {
$("#slider").animate({
marginTop: "-155px"
}, 500 );
$("#topMenuImage").html('<img src="trigger_m.png"/>');
$("#openCloseIdentifier").show();
} else {
$("#slider").animate({
marginTop: "0px"
}, 500 );
$("#topMenuImage").html('<img src="trigger_r.png"/>');
$("#openCloseIdentifier").hide();
}
});
});
</script>
<div id="sliderWrap">
<div id="openCloseIdentifier"></div>
<div id="slider">
<div id="sliderContent">
Isn't this nice?
</div>
<div id="openCloseWrap">
<a href="#" class="topMenuAction" id="topMenuImage">
<img src="trigger_m.png" alt="open" />
</a>
</div>
</div>
</div>