Форум программистов, компьютерный форум, киберфорум
Наши страницы
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
 
Рейтинг 4.60/10: Рейтинг темы: голосов - 10, средняя оценка - 4.60
К у К л о в о Д
0 / 0 / 2
Регистрация: 26.11.2013
Сообщений: 53
#1

Увеличение и уменьшение размера <div>'a

19.10.2014, 16:04. Просмотров 1752. Ответов 25
Метки нет (Все метки)

Такое дело: тело страницы делится на 2 части по длине, в первой части есть меню. Нажимаем на синюю часть(пункт) меню, выпадает зеленый список, !!! верхняя часть увеличивается, нижняя уменьшается !!!. Помогите, весь мозг сломал не могу придумать как это делать, хотя бы натолкните. В верстке новичок.
Увеличение и уменьшение размера <div>'a
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
19.10.2014, 16:04
Ответы с готовыми решениями:

Пропорциональное уменьшение/увеличение фона в зависимости от размера блока
Добрый день! Посоветуйте пожалуйста, как пропорционально уменьшать backround:...

увеличение - уменьшение изображения
пример вот здесь - http://www.el-tuning.ru/index.html сделать средствами HTML

Плавное увеличение и уменьшение изображения
Вечер добрый, есть такой код: .entry-thumbnail:hover{ transform:...

CSS!? Div в div'e, как не потерять позиции css внутреннего div'a при изменении размера браузера?
вот когда изменяю размер браузера, то внутренний div не хочет изменяться вместе...

Увеличение\уменьшение радиуса круга. Внимание! НОВИЧОК
Доброе время суток! Подскажите, как реализовать следующую задачу: Есть круг...

25
Fedor92
20.10.2014, 17:19     Увеличение и уменьшение размера <div>'a
  #21

Не по теме:

Цитата Сообщение от and_y87 Посмотреть сообщение
Fedor92, Верстальщик - верстальщик...
Front-End Разработчик - программист )
Ну так и я про то...:friends:

0
and_y87
Web-Разработчик
407 / 355 / 78
Регистрация: 27.02.2012
Сообщений: 1,311
Записей в блоге: 84
20.10.2014, 17:39 #22
К у К л о в о Д, по картинке не очень понятно...
состояние красного блока....
он просто опускается вниз на расстояние равное высоте зелёного блока...
или он уменьшается по высоте на на расстояние равное высоте зелёного блока ?
0
Fedor92
Человек из 90-х
Эксперт HTML/CSS
2636 / 2280 / 1017
Регистрация: 15.12.2012
Сообщений: 8,437
Записей в блоге: 1
20.10.2014, 17:42 #23
Цитата Сообщение от and_y87 Посмотреть сообщение
по картинке не очень понятно...
состояние красного блока....
он просто опускается вниз на расстояние равное высоте зелёного блока...
или он уменьшается по высоте на на расстояние равное высоте зелёного блока ?
Он уменьшается... Без js никак... Но если выпилите на css - я перестану заходить в инэт с ie8...
0
and_y87
Web-Разработчик
407 / 355 / 78
Регистрация: 27.02.2012
Сообщений: 1,311
Записей в блоге: 84
20.10.2014, 17:45 #24
Fedor92, Многие пользователи не то что заходить в инет с IE8 ... многие перестали пользоваться IE в целом... Почему Вы всё ещё его терпите?
0
Fedor92
20.10.2014, 18:02
  #25

Не по теме:

Ну с этим всё просто... Во-первых когда только начинал верстать альтернативой ie был только netscape и поэтому разных прибамбасов ещё не было вроде анимации... Люди были вынуждены отключать в браузерах даже графику из-за маленькой скорости инэта... По факту html и css - формировались в это время и лучшим индикатором на то время для проверки вёрстки был именно ie... Затем шу выдавил netscape и захватил монополию на рынке браузеров... Затем появились новые броузеры: ff, opera, chrome - мощные с поддержкой множества новых библиотек для разработчика... W3C среагировало и под данные браузеры создаёт новые css спецификации(где уже всё потихоньку перемешивается), а Гейтс отказался отдавать рынок и перестал реагировать на обновление css, что собственно и стало причиной появления термина кроссбраузерности... Так я к чему виду разговор... Сам очень люблю минимализм, т.е. минимум кода больше дела... На мой взгляд оценить качество голой вёрстки без css на сегодняшний день объективно можно с помощью 2-х браузеров: шу и ff - первый, потому-что стоял у истоков, второй потому-что ориентирован на вэб-разработчиков... Поскольку создатели современных браузеров стараются отображать содержимое веб-страниц лучше, чем они есть на самом деле... Поэтому, чтобы не лагали сайты и не было проблем с вёрсткой всегда рекомендую верстать именно под эти браузеры... А вторая причина посещаемость согласно метрике в месяц в среднем формируется около 8000 посетителей исользующих шу... Вероятнее всего - это пользователи "хрюш" поддержка которых уже закончилась + второстепенный фактор жители китая, у большинства которых на ПК стоят именно хрюши... Таким вот образом...

0
К у К л о в о Д
0 / 0 / 2
Регистрация: 26.11.2013
Сообщений: 53
20.10.2014, 18:40  [ТС] #26
Вот такая ерунда. Нажимаем на красный, выпадает черный, увеличивается желтый, уменьшается синий.
CSS
1
2
3
4
5
6
.cont{width:200px; height:200px;}
    .up{width:100%;height:50%;display:inline-block;}
    .down{width:100%;height:50%; background-color:#00F;display:inline-block;}
    .menu{width:50%; height:100%; background-color:#F00; display:inline-block; float:left; cursor:pointer}
    .telo{width:50%; height:100%; background-color:#FF0; display:inline-block;}
    .punkt{ display:none;width:100%; height:100%; background-color:#000;}
HTML5
1
2
3
4
5
6
7
8
9
10
<div class="cont">
    <div class="up">
        <div class="menu">
            <div class="punkt"></div>
        </div>
        <div class="telo"></div>
    </div>
    <div class="down">
    </div>
</div>
Javascript
1
2
3
4
5
6
jQuery(document).ready(function($){
 $('.menu').click(function(){
  $(this).parent().children('div.punkt').slideToggle('normal');
  return false;
 });
});
Только это не работает, вот и прошу помочь.
0
20.10.2014, 18:40
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
20.10.2014, 18:40

Теги при написании новостей, а именно [thumb]. Увеличение и уменьшение картинки
Как нужно: 1. При клики на маленькое изображение размерами width=&quot;190&quot;...

Уменьшение размера окна и все расходится в стороны
Что исправить? Пытался fixed, absolute ставить, не получилось! Фон: ...

Увеличение размера радиокнопки
Подскажите пожалуйста как увеличить размер радиокнопки.


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
26
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru