jquery перед загрузкой библиотеки
Есть элементарный спойлер, но jquery подключается в конце страницы, так(естественно не работает):
<html>
<head>
<script>
jQuery(document).ready(function(){
jQuery('.spoiler-content').hide()
jQuery('.spoiler').click(function(){
jQuery(this).toggleClass("close").toggleClass("open").next().toggle()
})
})
</script>
</head>
<body>
...
<script type="text/javascript" src="jquery.js"></script>
</body>
</html>
Если подключить jquery в <head>, то всё гут. Как переделать спойлер так, чтобы работало независимо от того, где подключен jquery |
window.onload = function() {
$('.spoiler-content').hide()
$('.spoiler').click(function(){
$(this).toggleClass("close").toggleClass("open").next().toggle()
})
}
|
Toki, опусти скрипт спойлера ниже скрипта jQuery. Это элементарно, не?
|
Цитата:
danik.js С удовольствием бы, но нельзя. |
window.addEventListener('DOMContentLoaded', function() {
$('.spoiler-content').hide()
$('.spoiler').click(function(){
$(this).toggleClass("close").toggleClass("open").next().toggle();
})
});
|
Ruslan_xDD, спасибо огромное, все работает :)
|
Не плохо бы проинформировать что способ не работает в IE8
|
Toki,
:) Или поставить на класс <div class="spoiler-content" style="display:none" |
Deff, и как это поможет?
|
Цитата:
При всяких слайдерах и больших фонах так и будет точать открытым |
Все правильно. Пока средства (js код), позволяющие открыть спойлер не подгрузились гарантированно - спойлер пусть будет открытым.
|
Toki,
как вариант по таймеру проверять подгрузилось ли jQuery - если да таймер незапускать больше а нужный код проинициализировать |
:) Имхо, проще уж на тег
<html>
<head>
<style>
.spoiler-content {
display:none;
}
.spoiler b{
display:none;
cursor:pointer;
padding:13px;
color:blue;
}
.spoiler.close b:first-child{
display:block;
}
.spoiler.open b:last-child {
display:block;
}
</style>
<script>
function myFunk(sel) {
$(sel).toggleClass("close").toggleClass("open").next().toggle()
}
</script>
</head>
<body>
<div class="spoiler close" onclick="myFunk(this)"><b>Открыть</b><b>Cкрыть</b></div>
<div class="spoiler-content">
Привет!<br/>
Привет!<br/>
Привет!<br/>
</div>
...
<script src="http://code.jquery.com/jquery-latest.js"></script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 00:27. |