О сайте | Обратная связь | Памятка для вебмастера

Конструктор кнопок он-лайн

Подбор цветов

Справочник по html и CSS

Наши копирайтеры

Поиск

[ Регистрация · Войти · Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Модератор форума: KorniloFF 
Форум » Создание сайта » JAVA-Scripts » Вёрстка спойлера (Вёрстка спойлера)
Вёрстка спойлера
Chips Дата: Воскресенье, 18.12.2016, 20:16 | Сообщение # 1
Первоклашка
Группа: Пользователи
Сообщений: 4
Город: Мегион
Репутация: 0
Статус: Offline
Задание 2: Сначала на странице только текст стихотворения и кнопка с надписью «показать свечу». При нажатии на кнопку текст стихотворения прячется, на его месте появляется рисунок, и надпись на кнопке меняется на «показать текст». Если еще раз нажать на кнопку, рисунок исчезает и появляется текст. Текст cтихотворения (Анненский.doc) и рисунок (свеча1.gif) скопировать из сетевой папки. Параметры форматирования страницы:
 Цвет фона темно-синий, размер шрифта 22, курсив, цвет шрифта белый.
 Рамка вокруг текста: цвет #ffA089, тип outset, толщина 5.
 Картинка размером 200 на 200.
 Рамка вокруг картинки: цвет #ffA089, тип outset, толщина 50, отступы по 5.

Вот мой листинг, что то я сделал не так, как исправить?
Код

<html>
<head>
        <script type="text/javascript" src="js/jquery-3.1.1.js"></script>
    </head>

<style>
                body {background-color:#0000FF;color:white;}
        p{ width: 400px; height:550px; font-style:italic; font-size:22px; border-width: 5px;border-style: outset;border-color:#ffa089; }
                img{width: 200px; height: 200px; border-width: 50px;border-style:
outset;border-color:#ffa089;}
        </style>
<body>
<input type="button" id="go" value="Показать изображение" onclick="displ1();>
<img id="kartinka" src="свеча1.gif" class="img"></img>
<h2>Иннокентий Анненский</h2>
<h1>СВЕЧКУ ВНЕСЛИ</h1>
<p id="text">Не мерещится ль вам иногда,<br>
Когда сумерки ходят по дому,<br>
Тут же возле иная среда,<br>
Где живем мы совсем по-другому?<br>
<br>
С тенью тень там так мягко слилась,<br>
Там бывает такая минута,<br>
Что лучами незримыми глаз<br>
Мы уходим друг в друга как будто.<br><br>

И движеньем спугнуть этот миг<br>
Мы боимся, иль словом нарушить,<br>
Точно ухом кто возле приник,<br>
Заставляя далекое слушать.<br><br>

Но едва запылает свеча,<br>
Чуткий мир уступает без боя,<br>
Лишь из глаз по наклонам луча<br>
Тени в пламя сбегут голубое.<br>
</p>
<br />
<script type="text/javascript">

$("#go").click(function(){
            var _this = $(this);
            if ($("#text").hasClass("p")) {
                $("#text").removeClass("p").addClass("img");
                _this.val("Показать изображение");
                }
            else {
                $("#text").removeClass("img").addClass("p");
                _this.val("Показать текст");
                }
            });

$("#go").click(function displ1(){
if (("#kartinka").style.display == 'none'          )
{("#text).style.display = 'block'}
else {("#kartinka").style.display = 'none'}

            });

</script>
</body>
KorniloFF Дата: Среда, 28.12.2016, 15:19 | Сообщение # 2
Профессор(ша)
Награды: 27
Группа: Администраторы
Сообщений: 3439
Город: Ялта
Репутация: 251
Статус: Offline
Chips, прости, пропустил твой пост.
Вот рабочий пример
Вот код:
Код
<script type="text/javascript">
document.querySelector('#go').onclick= dToggle;
function dToggle () {
    var i= document.querySelector('#kartinka'), txt= document.querySelector('#text');
    if (i.hidden) {
  txt.hidden=1; i.hidden=0;
  this.value= "Показать текст";
    } else {
  txt.hidden=0; i.hidden=1;
  this.value= "Показать изображение";
    }
}
</script>




Z146965124780
R374477004237
Ну, или хотя бы добавьте в репутацию.
Форум » Создание сайта » JAVA-Scripts » Вёрстка спойлера (Вёрстка спойлера)
Страница 1 из 11
Поиск:
Вёрстка спойлера - Создание сайта - JAVA-Scripts - Форум
Сегодня были на форуме:
OliioToil, chernakova-marina, tarasova87