как показать скрытый спан элемент
Хотим показать при клике на ссылку с классом "next" скрытый спан элемент с классом "invisible" (спан скрыт в атрибуте style спана).
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link href="style2.css" rel="stylesheet"> </head> <body> <div class="film"><h1>Побег из Шоушенка</h1><img alt="" src="http://st.kp.yandex.net/images/film_iphone/iphone360_326.jpg" class="poster"> <p>Успешный банкир Энди Дюфрейн обвинен в убийстве собственной жены и ее любовника. Оказавшись в тюрьме под названием Шоушенк, он сталкивается с жестокостью и беззаконием, <a href="" class ="next dn">Дальше </a> <span class="invisible" style="display: none">царящими по обе стороны решетки. Каждый, кто попадает в эти стены, становится их рабом до конца жизни. Но Энди, вооруженный живым умом и доброй душой, отказывается мириться с приговором судьбы и начинает разрабатывать невероятно дерзкий план своего освобождения.</span></p> </div> var next = document.querySelector('.next'); var inv = document.querySelector('.invisible'); function vis () { inv.style.display = "inline"; } next.onclick = vis; </body> </html> Почему спан элемент по клику показывается и через секунду исчезает? Как лучше это реализовать? |
СергейХ,
потому что страница перезагрузилась Пожалуйста, отформатируйте свой код! Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [js] ... ваш код... [/js] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
а почему страница перезагрузилась?
и в каких случаях она перезагружается? и можно ли сделать чтобы она не перезагрузилась? |
СергейХ,
https://learn.javascript.ru/default-browser-action function vis () { inv.style.display = "inline"; *!* return false */!* } |
Цитата:
|
СергейХ, :-?
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <link href="style2.css" rel="stylesheet"> </head> <body> <div class="film"><h1>Побег из Шоушенка</h1><img alt="" src="http://st.kp.yandex.net/images/film_iphone/iphone360_326.jpg" class="poster"> <p>Успешный банкир Энди Дюфрейн обвинен в убийстве собственной жены и ее любовника. Оказавшись в тюрьме под названием Шоушенк, он сталкивается с жестокостью и беззаконием, <a href="" class ="next dn">Дальше </a> <span class="invisible" style="display: none">царящими по обе стороны решетки. Каждый, кто попадает в эти стены, становится их рабом до конца жизни. Но Энди, вооруженный живым умом и доброй душой, отказывается мириться с приговором судьбы и начинает разрабатывать невероятно дерзкий план своего освобождения.</span></p> </div> <script> var next = document.querySelector('.next'); var inv = document.querySelector('.invisible'); function vis () { inv.style.display = "inline"; return false } next.onclick = vis; </script> </body> </html> |
Часовой пояс GMT +3, время: 13:40. |