Форум Сайтостроение Веб-строительство

Способы сделать спойлер на сайте

12
trend
На сайте с 05.04.2010
Offline
29
trend
3898

Суть такова

нужно сделать спойлер

например ссылка , после нажатия на неё появляется скрытая картинка или большой текст без переходов и обновления страницы, подскажите способы реализации

Мои товары на аукро (http://aukro.ua/listing/user/listing.php?us_id=33650326)
T.R.O.N
На сайте с 18.05.2004
Offline
314
T.R.O.N
#1

Спо́йлер, от англ. to spoil — «гадить», «портить»

говорите русским языком - это называется, обновление страницы без перезагрузки. Для х..вого сайта - просто скрыть/показать див. Для хорошего - курите тему "AJAX"

От воздержания пока никто не умер. Хотя никто и не родился! Prototype.js был написан теми, кто не знает JavaScript, для тех, кто не знает JavaScript (Richard Cornford)
eTarget 2011:Панельная дискуссия «Стратегия eTarget 2011: Круглый стол Могут ли «плохие» входящие
trend
На сайте с 05.04.2010
Offline
29
trend
#2

спойлер в переводе с английского - прерыватель потока

Ну так как всё таки скрыть показать этот див? Дайте пример кода пожалуйста

T.R.O.N
На сайте с 18.05.2004
Offline
314
T.R.O.N
#3
trend:
спойлер в переводе с английского - прерыватель потока

покажите где такое взяли? 


<script>

function a(){document.getElementById("c").style.visibility = 'visible'; return false;}

function b(){document.getElementById("c").style.visibility = 'hidden'; return false;}

</script>



<a href="#" onclick="return a();">показать</a> <a href="#" onclick="return b();">скрыть</a>

<div id="c" style="visibility:hidden;"> спойлер спойлер спойлер спойлер спойлер </div>
stiliar
На сайте с 04.03.2008
Offline
79
stiliar
#4

Еще способ. Здесь будет только одна ссылка, при клике на которую будет открывать/прятать содержимое. 

<html><head> 

<title>Spoiler HTML code</title> 

<style type="text/css"> 

.onner {color: blue} 

.spoiler {border:0px solid #ddd; padding:3px;} 

.spoiler .inner {border:0px solid #eee; padding:3px;margin:3px;} 

</style> 



<script type="text/javascript"> 

function showSpoiler(obj) {var inner = obj.parentNode.getElementsByTagName("div")[0]; if (inner.style.display == "none") inner.style.display = ""; else inner.style.display = "none"; } 

</script> 



</head> 

<body> 



<div class="spoiler"> 

<span class="onner" onclick="showSpoiler(this);">Показать/Скрыть</span> 

<div class="inner" style="display:none;">Скрытое содержимое</div></div> 



</body></html>
[Удален]
#5

http://clear.helldude.ru/2009/06/17/javascript-phpdudeslider-%D1%81%D0%BB%D0%B0%D0%B9%D0%B4%D0%B5%D1%80-%D0%B1%D0%BB%D0%BE%D0%BA%D0%BE%D0%B2-html-%D0%BA%D0%BE%D0%B4%D0%B0/

SG
На сайте с 22.04.2008
Offline
32
SAG
#6

http://api.jquery.com/slideToggle/

Портфолио (http://beastman.me). Верстаю (/ru/forum/228498). Програмлю (/ru/forum/348359). Последние отзывы (/ru/forum/470865). Контакты: ICQ: 31377144пять;E-mail: andrschwartz<собако>gmail.com
T.R.O.N
На сайте с 18.05.2004
Offline
314
T.R.O.N
#7

SAG, вместо 3 строк, 40К говнокода... очень классно

trend
На сайте с 05.04.2010
Offline
29
trend
#8
T.R.O.N:
покажите где такое взяли?

в гугл переводчике

S8
На сайте с 26.09.2008
Offline
45
Smile8979
#9
T.R.O.N:
Спо&#769;йлер, от англ. to spoil — «гадить», «портить»

Таки если мне память не изменяет то spoil - глагол а spoiler - существительное и переводиться как "помеха".

rtyug
На сайте с 13.05.2009
Offline
263
rtyug
#10

еще так:

jquery

<script type="text/javascript">
$(document).ready(function(){
$('.knob').hide()
$('.spoiler').click(function(){
$(this).next().toggle()
})
})
</script>

knob - div

spoiler -div

Спалил тему: Pokerstars вывод WMZ, etc на VISA 0% или SWIFT + Конверт USD/GBP,etc (net profit $0,5 млрд) (https://minfin.com.ua/blogs/94589307/115366/) Monobank - 50₴ на счет при рег. тут (https://clck.ru/DLX4r) | Номер SIP АТС Москва 7(495) - 0Ꝑ, 8(800) - 800Ꝑ/0Ꝑ (http://goo.gl/XOrCSn)
12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий