Попытка показать DIV в jQuery
У меня есть этот java-код:
<script src = "http://www.google.com/jsapi"></script>
<script type = "text/javascript">
google.load("jquery", "1.2.6");
$("a#more").click(function() {
$("#info_box").show("blind", { direction: "vertical" }, 800);
});
</script>
И эта ссылка:
<a href = "#" id = "more">More Info...</a>
info_box - это просто div со свойствами:
width: 30%;
position: absolute;
left: 35%;
top: 250px;
background-color: #FFFFFF;
border: 2px solid #000000;
visibility: hidden;
Как это может не работать, 20 минут пытался разобраться.
Ответы 3
Вы уверены, что вызываете нужную функцию? Согласно документам в http://docs.jquery.com/Effects/show функция show принимает скорость в качестве первого параметра, а функцию обратного вызова - в качестве второго. Думаю, ваши "blind" и { direction: "vertical" } неуместны.
Также стоит проверить, нет ли конфликта с другим скриптом, например. mootools.
Вы можете использовать функцию ready() и display: none в начальном CSS.
Рабочий HTML:
<html>
<head>
<script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type = "text/javascript"></script>
<script type = "text/javascript">
$(document).ready(
function()
{
$("a#more").click(function() {
$("#info_box").show("blind");
});
});
</script>
<style>
#info_box {
width: 30%;
position: absolute;
left: 35%;
top: 250px;
background-color: #FFFFFF;
border: 2px solid #000000;
display: none;}
</style>
</head>
<body>
<a href = "#" id = "more">More Info...</a>
<div id = "info_box">Secret info goes here</div>
</body>
</html>
Также есть проблемы с функцией показа. Вы используете недокументированный params.
Вместо этого используйте функцию «анимировать», чтобы создать собственную анимацию.
Я также рекомендую вам использовать Firebug для устранения проблем с javascript в будущем.
У меня была точно такая же проблема. Вам необходимо загрузить плагин jQuery ui, а также обычный JQuery, чтобы использовать имеющийся у вас формат.
Я использую только jQuery, и это не проблема с функцией $ ("# info_box"). Show (); тоже не работает.