Спасибо вам огромное!
|
Всем снова привет! Возникла необходимость немного изменить этот код, а как не знаю.
В общем нужно, что бы это работало в определённом блоке:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.storyimg{display: none;}
</style>
<script>
var show;
function toggle(cls)
{
show = !show
var divs = document.getElementsByClassName(cls);
for (var i=0; i<divs.length; i++) {divs[i].style.display= show ? 'block':'none'}
}
</script>
</head>
<body>
<a class="yr" onclick="toggle('storyimg');return(false)">Показать картинки</a>
<div class="news-text-full">
<div class="storyimg">
<img src="...">
</div>
<div class="storyimg">
<img src="...">
</div>
<div class="storyimg">
<img src="...">
</div>
</div>
</body>
</html>
Чтобы этот скрипт работал только в блоке .news-text-full Заранее спасибо! |
:write:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.storyimg{display: none;}
</style>
<script>
var show;
function toggle(cls)
{
show = !show
var divs = document.querySelectorAll(cls);
for (var i=0; i<divs.length; i++) {divs[i].style.display= show ? 'block':'none'}
}
</script>
</head>
<body>
<a class="yr" onclick="toggle('.news-text-full .storyimg');return(false)">Показать картинки</a>
<div class="news-text-full">
<div class="storyimg">
<img src="...">
</div>
<div class="storyimg">
<img src="...">
</div>
<div class="storyimg">
<img src="...">
</div>
</div>
</body>
</html>
Здравствуйте! Судя по вашему сообщению, вы ну совсем не знаете javascript. Освойте основы языка и вопрос отпадет сам, полностью или частично. А с чем не справитесь - поможем. На сайте javascript можно начать изучать с учебника, раздел Основы javascript. Возможно, вам также понадобится HTML - учебник есть, например, здесь: http://ru.html.net/tutorials/html/ Задавайте конкретные вопросы по ходу дела. |
Ещё один вариант на тему показать скрыть со сменой текста
:write:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.news-text-full div{display: none;}
a{cursor: pointer;}
</style>
<script>
var toggle = function (cls, yes, no) {
var show;
return function (obj) {
show = !show;
obj['textContent'||'text'] = show ? no : yes;
var divs = document.querySelectorAll(cls);
for (var i = 0; i < divs.length; i++) {
divs[i].style.display = show ? 'block' : 'none'
}
return false
}
};
var showNews = toggle('.news-text-full .storyimg','Показать картинки','Скрыть картинки'),
showStory = toggle('.news-text-full .story','Показать картинки','Скрыть картинки');
</script>
</head>
<body>
<a class="yr" onclick="return showNews(this)">Показать картинки</a>
<div class="news-text-full">
<div class="storyimg">
<img src="...">
</div>
<div class="storyimg">
<img src="...">
</div>
<div class="storyimg">
<img src="...">
</div>
</div>
<br>
<a class="yr" onclick="return showStory(this)">Показать картинки</a>
<div class="news-text-full">
<div class="story">
<img src="...">
</div>
<div class="story">
<img src="...">
</div>
<div class="story">
<img src="...">
</div>
</div>
</body>
</html>
|
http://jsfiddle.net/vlasenkofedor/zQ6ae/
демонстрация возможности :) |
| Часовой пояс GMT +3, время: 21:19. |