X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> DIV, меняющий высоту
Pigment
Pigment
Topic Starter сообщение 31.1.2010, 8:50; Ответить: Pigment
Сообщение #1


Доброго времени суток.
Мне для сайта понадобился JS, который делает вот что: при нажатии на ссылку №1, DIV №1 измеяет свою высоту с 0 до значения X.
[B]Скрипт в хеде:[/B]
<script type="text/javascript" src="jquery-1.3.1.min.js" ></script>
<!--//<![CDATA[
$(document).ready(function(){
    $("#LINK-№1").click(function(){
        $("#block-№1").slideToggle("normal");
  });
});//]]>–>
</script>
[B]Ссылка:[/B]
<a id="LINK-№1" href="javascript:">Название</a>
[B]DIV:[/B]
<div id="block-№1">Содержимое
</div>
Затем нужно было добавить еще один DIV №2, но только чтобы он запускался от ссылки №2:
<script type="text/javascript">
<!--//<![CDATA[
$(document).ready(function(){
    $("#LINK-№2").click(function(){
        $("#block-№2").slideToggle("normal");
  });
});
$(document).ready(function(){
    $("#LINK-№2").click(function(){
        $("#block-№2").slideToggle("normal");
  });
});
//]]>–>
</script>
Оба DIV меняют свою высоту, как и должно.
Кто хорошо знаком с JS, подскажите правильно ли я составил скрипт, есть ли вариант сделать его более компактным?
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Htmlmaster
Htmlmaster
сообщение 31.1.2010, 11:36; Ответить: Htmlmaster
Сообщение #2


всё правильно, но советую не использовать такие знаки, как № и т.п. это самый компактный код, на чистом Javascript надо писать оч много:goodpost:
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Pigment
Pigment
Topic Starter сообщение 31.1.2010, 11:46; Ответить: Pigment
Сообщение #3


Если вы правы то я думаю для новичка отлично! :evrika:
P.S. номера писал для понимания, вообще у меня стоит block-x и block-y. ;)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Htmlmaster
Htmlmaster
сообщение 31.1.2010, 13:07; Ответить: Htmlmaster
Сообщение #4


Для новичка хорошо, для профи тоже интересная функция, но при нажатии меняются стили и всё такое, так что надо идти в гору....желаю успехов:popcorn1:
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
alexdrob
alexdrob
сообщение 31.1.2010, 13:25; Ответить: alexdrob
Сообщение #5


(Pigment @ 31.1.2010, 13:46) *
P.S. номера писал для понимания, вообще у меня стоит block-x и block-y


Ну так номера пишите, все пишут номера, просто символ № не используйте

LINK-2
LINK_2
LINK2
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Pigment
Pigment
Topic Starter сообщение 31.1.2010, 13:50; Ответить: Pigment
Сообщение #6


Ну раз код правильно написал, то еще у меня такой вопрос, как можно сделать так, чтобы при клике на ссылке №1 или №2 все затемнялось, кроме появившегося DIV?
Сложно ли это выполнить?
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Htmlmaster
Htmlmaster
сообщение 1.2.2010, 0:32; Ответить: Htmlmaster
Сообщение #7


использовать метод addClass("<имя класса>")
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Letmetouchyou
Letmetouchyou
сообщение 1.2.2010, 11:11; Ответить: Letmetouchyou
Сообщение #8


Pigment, создай див, который размерами будет 100% x 100% экарна, и просто показывайе го поверх всего. ДЛя эффетка хатемненности сделай его черным цветом и opacity:0.6 где то. А нужный див показуй поверх затемнения.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Letmetouchyou
Letmetouchyou
сообщение 1.2.2010, 11:15; Ответить: Letmetouchyou
Сообщение #9


а насчет комптонти то можно так, но тут одно условие -сворачиваюшийся блок долженнахожиться сразу после ссылки.
<script>
$(document).ready(function(){
$("a").click(function(){
$(this).next().slideToggle("normal");
});
});
</script>
<a href="#">Название1</a>
<div>Содержимое1</div>
<a href="#">Название2</a>
<div>Содержимое2</div>
<a href="#">Название3</a>
<div>Содержимое3s</div>



и $(document).ready(function(){ ненужно использовть несколько раз на странице , как вы делали

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
« Предыдущая тема · Программная часть · Следующая тема »
 
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Моя div-ная верстка соответствует ли стандартам
Хотелось бы конструктивной критики
 10 muratastana 1603 14.1.2023, 1:16
автор: xweb
Открытая тема (нет новых ответов) DIV'ы в строку
 0 RedEclipse 5465 29.9.2016, 17:53
автор: -RedEclipse-
Открытая тема (нет новых ответов) при выборе radio в option не скрывались div
 0 serj123 6931 17.4.2016, 17:45
автор: -serj123-
Открытая тема (нет новых ответов) Как заставить отображать несколько элементов DIV в одну строку?
 2 Aalena 4027 10.1.2016, 10:18
автор: -Aalena-
Открытая тема (нет новых ответов) Фоны в в div'ах расходятся при сужении экрана
 1 Balalaaika1 5639 2.6.2015, 19:35
автор: -Degradator-


 

Режим отображения: Стандартный · Переключить на: Линейный · Переключить на: Древовидный

Подписка на тему · Сообщить другу · Версия для печати · Подписка на этот форум

RSS Текстовая версия Сейчас: 25.4.2024, 15:51

Дизайн

 
Форум IP.Board © 2024  IPS, Inc.
Лицензия зарегистрирована на: MaulNet
Jooble
Форум IP.Board © IPS, Inc.
Лицензия зарегистрирована на: MaulNet