Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.03.2018, 22:11
Аспирант
Отправить личное сообщение для SpaceAlarm Посмотреть профиль Найти все сообщения от SpaceAlarm
 
Регистрация: 05.05.2016
Сообщений: 92

Jquery -> javascript
Добрый вечер, нужно с jquery перевести в javascript код

$('.list-post').click(function(){
	if ($('.post').css("display") == "block") {
		$('.post').slideUp(500);
	} else {
		$('.post').slideDown(500);
	}
})
Ответить с цитированием
  #2 (permalink)  
Старый 23.03.2018, 09:18
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от SpaceAlarm
.slideUp(500)
.slideDown(500)
Это анимация...
Все обращения к классам - циклы...

У нас есть раздел "Работа".
Определись с бюджетом, огласи цифру. Может и желающие найдутся...
Ответить с цитированием
  #3 (permalink)  
Старый 23.03.2018, 11:01
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<button class="list-post">Hello World!</button>
	<div class="post">Hello World!</div>
	<script>

		var x = document.querySelector('.post'),
		n = getComputedStyle(x).height;
		x.style.maxHeight = n;
		x.style.transition = '1s';
		x.style.overflow = 'hidden';
		document.querySelector('.list-post').onclick = function(){ 
			x.style.maxHeight = x.style.maxHeight!== '0px'?'0px':n;
		};

	</script>
</body>
</html>

Последний раз редактировалось j0hnik, 23.03.2018 в 11:04.
Ответить с цитированием
  #4 (permalink)  
Старый 23.03.2018, 20:31
Аспирант
Отправить личное сообщение для SpaceAlarm Посмотреть профиль Найти все сообщения от SpaceAlarm
 
Регистрация: 05.05.2016
Сообщений: 92

Сообщение от j0hnik Посмотреть сообщение
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<button class="list-post">Hello World!</button>
	<div class="post">Hello World!</div>
	<script>

		var x = document.querySelector('.post'),
		n = getComputedStyle(x).height;
		x.style.maxHeight = n;
		x.style.transition = '1s';
		x.style.overflow = 'hidden';
		document.querySelector('.list-post').onclick = function(){ 
			x.style.maxHeight = x.style.maxHeight!== '0px'?'0px':n;
		};

	</script>
</body>
</html>
Спасибо!
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
javascript --> jquery Marker Events/DOM/Window 10 03.02.2013 21:52
jquery after не успевает подгрузить внешний javascript? footniko Events/DOM/Window 0 14.03.2012 23:43
JQUERY -> JavaScript propostaff jQuery 4 02.03.2012 14:07
jQuery и Input - > radio yu_ jQuery 3 02.04.2010 00:43
jQuery и переменные JavaScript master-sheff AJAX и COMET 2 22.01.2010 21:28