Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.10.2012, 15:08
Новичок на форуме
Отправить личное сообщение для fabrique Посмотреть профиль Найти все сообщения от fabrique
 
Регистрация: 31.07.2012
Сообщений: 9

Добавить / удалить класс кликом
Добрый день!
Перерыл кучу сайтов... не нашел того что нужно. Сам я примерно понимаю, что нужно, но с синтаксисом совсем не знаком.
Мне нужно что бы при клике по элементу с id="button" другому элементу с id="element" добавлялся класс class="expand" а при повторном клике по тому же элементу id="button" этот класс удалялся...

Как добавить класс - я нашел
<script type="text/javascript">
$("#button").click(function(){
  $("#element").addClass("expand");
});
</script>



Код:
<div id="button">Кнопка</div>
<div id="element">Блок с контентом</div>

А как сделать, что бы этот класс удалить при повторном клике ... нет.
Я так понимаю нужно сделать проверку на наличие этого класса - и если он есть - то удалить его... Я так понимаю, что это делается при помощи функции .hasClass, НО я никак не могу все это вместе собрать...

Помогите пожалуйста!
Ответить с цитированием
  #2 (permalink)  
Старый 30.10.2012, 15:17
Аватар для NikolasGrad
Аспирант
Отправить личное сообщение для NikolasGrad Посмотреть профиль Найти все сообщения от NikolasGrad
 
Регистрация: 12.04.2012
Сообщений: 49

$("#button").click(function(){
  $("#element").toggleClass("expand");
});

toggleClass
Ответить с цитированием
  #3 (permalink)  
Старый 30.10.2012, 15:26
Новичок на форуме
Отправить личное сообщение для fabrique Посмотреть профиль Найти все сообщения от fabrique
 
Регистрация: 31.07.2012
Сообщений: 9

Спасибо!
Ответить с цитированием
  #4 (permalink)  
Старый 03.09.2014, 01:14
Новичок на форуме
Отправить личное сообщение для sav-oks Посмотреть профиль Найти все сообщения от sav-oks
 
Регистрация: 03.09.2014
Сообщений: 8

Помогите разобраться.
Есть код:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Документ без названия</title>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="jquery-migrate-1.2.1.min.js"></script>

<script type="text/javascript">
$("#button1").click(function(){
$("#element").toggleClass("class");
$("#element2").toggleClass("class");
});
</script>
</head>
<body>
<button id="button1">батон</button>
<div id="element"></div>
<div id="element2"></div>

<style type="text/css">
#element { width: 50px; height: 50px; border: 1px solid #000000; }
#element2 { width: 50px; height: 50px; border: 1px solid #1065D8; }
.class { width: 100px; height: 100px; }
.class2 { width: 100px; height: 100px; }
#button1 { background: rgba(35,110,179,1.00); color: rgba(21,227,211,1.00) }
</style>

</body>
</html>

Задача. При нажатие на кнопку, добавить стиль к элементу, именно добавить, так как планируется подключить анимацию перехода от одного стиля к другому.
Переход не работает, подскажите, что я делаю не так?
Ответить с цитированием
  #5 (permalink)  
Старый 03.09.2014, 04:43
Новичок на форуме
Отправить личное сообщение для maksbaks Посмотреть профиль Найти все сообщения от maksbaks
 
Регистрация: 02.09.2014
Сообщений: 4

помогите прошу,
http://javascript.ru/forum/showthrea...692#post328692
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
подскажите как удалить div alex2012 jQuery 5 13.10.2016 17:43
Как удалить класс всех дочерних элементов? Jeremen Events/DOM/Window 8 01.09.2012 20:43
Активный класс заголовка списка Wolk_ Общие вопросы Javascript 1 13.06.2012 17:20
Передал аяксом класс в <div>, но как отловить событите клик на этот класс ? saturn Элементы интерфейса 11 31.05.2012 10:30
Jquery немогу установить класс! shureg Общие вопросы Javascript 4 26.10.2010 14:37