я новичок в JQ У меня есть этот скрипт, который я нашел в интернете, и он делает именно то, что мне нужно. но я хочу, чтобы скольжение происходило справа налево. Как я могу это сделать? Пожалуйста, помогите
вот код
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".slidingDiv").hide();
$(".show_hide").show();
$('.show_hide').click(function(){
$(".slidingDiv").slideToggle();
});
});
</script>
<style>
.slidingDiv {
height:300px;
background-color: #99CCFF;
padding:20px;
margin-top:10px;
border-bottom:5px solid #3399FF;
}
.show_hide {
display:none;
}
</style>
</head>
<body>
<div class="slidingDiv">
Fill this space with really interesting content. <a href="#" class="show_hide">hide</a></div>
<a href="#" class="show_hide">Show/hide</a>
Это можно сделать с помощью дополнительных эффектов как части jQuery-ui.
$('.show_hide').click(function () {
$(".slidingDiv").toggle("slide");
});
[тестовая ссылка][2]
Попробуйте это:
$(this).hide("slide", { direction: "left" }, 1000);
`$(this).show("слайд", { direction: "left" }, 1000);``
Я знаю, что прошел год с тех пор, как этот вопрос был задан, но просто для людей, которые собираются посетить эту страницу, я размещаю свое решение.
Используя то, что предложил @Aldi Unanto, вот более полный ответ:
jQuery('.show_hide').click(function(e) {
e.preventDefault();
if (jQuery('.slidingDiv').is(":visible") ) {
jQuery('.slidingDiv').stop(true,true).hide("slide", { direction: "left" }, 200);
} else {
jQuery('.slidingDiv').stop(true,true).show("slide", { direction: "left" }, 200);
}
});
Сначала я запрещаю ссылке делать что-либо при нажатии. Затем я добавляю проверку, является ли элемент видимым или нет. Если он виден, я скрываю его. Если скрыт - показываю. Вы можете изменить направление на левое или правое и длительность от 200 мс до любой другой.
Редактировать: Я также добавил
.stop(true,true)
для того, чтобы очистить очередь (clearQueue) и сделать остановку (jumpToEnd). Читайте о jQuery stop здесь.