Страница 7 из 23
Re: Дизайн интерфейса
Добавлено: Ср мар 19, 2014 7:03 pm
Alex
> Alex: Уж коль вы css и js только неделю осваиваете, не подкинете полезных ссылок для изучения, тож въеду
Э, не-ет. Осваиваю я почти год (без особого успеха), а вот въехал я только недавно.
Самая лучшая методика обучения это практика. Ну и не полениться и посвятить несколько дней изучению теории. Ставите себе задачу и пытаетесь её реализовать. За вопросами в поисковую систему. Если сообразительный — быстро поймёте что к чему, если такой как я, то через год.
Re: Дизайн интерфейса
Добавлено: Ср мар 19, 2014 7:03 pm
Alex
Попробовал.
display:none и js
творят чудеса. По нажатию элементов интерфейса появляются и пропадают блоки. Из этого можно сделать всё, что угодно.
То, что надо! Проблем больше нет, осталась творческая работа. Всем спасибо за помощь.
Re: Дизайн интерфейса
Добавлено: Чт мар 20, 2014 3:08 pm
Alex
Вопрос к lavstudia. Требуется ваша помощь.
Когда вкладок становится много, они начинают занимать вторую (третью...) строки, что никуда не годится. Вы можете сделать так, чтобы вместо занимания лишних строк, появлялась прокрутка по горизонтали?
Re: Дизайн интерфейса
Добавлено: Чт мар 20, 2014 4:15 pm
lavstudia
Alex - c ходу
<!doctype html>
<html>
<head>
<title>Горизонтальный скролл на CSS</title>
<style>
.wrap {
width: 800px;
height: 200px;
overflow-x: auto;
overflow-y: hidden;
}
.wrap ul {width: 2500px;}
.wrap li {
display: inline-block;
vertical-align: top;
width: 200px;
height: 200px;
margin-right: 20px;
}
</style>
</head>
<body>
<div class="wrap">
<ul>
<li><p>1</p></li>
<li><p>2</p></li>
<li><p>3</p></li>
<li><p>4</p></li>
<li><p>5</p></li>
<li><p>6</p></li>
<li><p>7</p></li>
<li><p>8</p></li>
<li><p>9</p></li>
<li><p>10</p></li>
</ul>
</div>
</body>
</html>
Не совсем гибкий подход ( .wrap ul {width: 2500px;} - преходится задавать вручную, но можно расчитать скриптом при загрузке), можно адаптировать!
2)
http://jsfiddle.net/pDRE9/
Re: Дизайн интерфейса
Добавлено: Чт мар 20, 2014 6:06 pm
Alex
Подождите, подождите, я совсем другое имел в виду. Видимо, я не так выразился. Посмотрите на скриншот — нужно, чтобы табы не залезали на второй ряд, а появлялась прокрутка табов справа в первом ряду.
Re: Дизайн интерфейса
Добавлено: Чт мар 20, 2014 9:19 pm
lavstudia
Alex - думаю первый вариант (выше) подходит (попробуйте создать html страницу и посмотреть)
или нужен вертикальный скрол справа?
Re: Дизайн интерфейса
Добавлено: Чт мар 20, 2014 11:11 pm
lavstudia
Как обещал - выкладываю частично "причёсанный" шаблон. Все далеко не идеально и не все заявленное (выше) еще сделано (iframe остались, табличная верстка в шапке, js код в шаблоне). Начало положено - возможно и другие проникнуться идеей, буду очень рад. Работа проверена в браузере
Google Chrome
Мини инструкция:
Данный шаблон извлечь из архива и поместить файл default.html и папку css с содержимым в папку templates_alt (если у вас там уже есть default.html, можно временно переименовать)
- screen.jpg (121.92 КБ) 11672 просмотра
Re: Дизайн интерфейса
Добавлено: Пт мар 21, 2014 6:47 am
Alex
> думаю первый вариант (выше) подходит
Re: Дизайн интерфейса
Добавлено: Пт мар 21, 2014 10:28 am
lavstudia
Re: Дизайн интерфейса
Добавлено: Пт мар 21, 2014 11:30 am
PAV
Визуально отличий не заметил. Скролбар такой же как был.