Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.11.2013, 07:03
Новичок на форуме
Отправить личное сообщение для Zatvornik Посмотреть профиль Найти все сообщения от Zatvornik
 
Регистрация: 11.11.2013
Сообщений: 3

Сделать контейнер шириной со всех детей. outerWidth
Хочу сделать прокрутку галереи. Делаю div фиксированной ширины с overflow:hidden, а внутри него двигаю div с картинками, изменяя свойство left. Внутренний div должен по ширине вмещать все картинки. Пытаюсь задать ширину - для всех детей суммирую outerWidth(true) и присваиваю контейнеру, но он получается уже, последняя картинка переносится ниже.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
  <title>Галерея</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"</script>
</head>
<body>
  <div id="container">
    <img src='1.jpg' />
    ...
    <img src='10.jpg' />
  </div>
  <script type="text/javascript">
    w = 0;
    $('#container').children().each(function(i,o){w += $(o).outerWidth(true)});
    $('#container').width(w);
  </script>
</body>
</html>

Между картинками есть расстояние, которое не учитывается, хотя padding border margin равны нулю. Написал w += $(o).outerWidth(true)+5, теперь ширина вроде подходящая, но меня пугает дикая константа, боюсь что в других условиях может поползти.
Почему так происходит и как следует поступить? Может, есть другой способ задать ширину? Может, есть другой способ сделать прокрутку?
Вложения:
Тип файла: zip outerwidthtest.zip (112.5 Кб, 8 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 11.11.2013, 11:05
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

Zatvornik,
#container img{
    float: left;
}


$(window).load(function ()
{
     w = 0;
		$('#container').children().each(function(i,o){w += $(o).outerWidth(true)});
		$('#container').width(w);
})
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как сделать ссылки из файла CSS корректными для всех директрорий сайта? GrEb (X)HTML/CSS 7 28.01.2020 12:56
Re: На JS сделать так, чтобы у всех полей type=number, убрались стрелочки и можно был westnord Общие вопросы Javascript 9 16.07.2013 13:19
Как сделать выборку среди детей одного элемента Почемучкин jQuery 4 29.08.2012 00:51
Как вывести всех детей? AquaGen Events/DOM/Window 7 22.06.2011 18:01
Как сделать, чтоб скрипт работал во всех браузерах? Владимир Седов Элементы интерфейса 2 24.12.2010 12:19