Вопрос к опытным верстальщикам и оптимизаторам

hatuns · 04-07-2012, 09:01:10

Цитата: --- от 02-07-2012, 21:38:58
Пожалуйста , если нужно могу подсказать как на разные экраны автоматически подставлять нужные файлы стилей , например у меня сейчас заказ , в котором нужно чтобы блоки типа голосование , календарь и тд при экранах от 1024 до 1280 были закрыты в блоки 50рх шириной и выезжали по клику , а после 1280 - были раскрыты , вот в таких ситуациях очень помогает ...

Да, конечно. Если сможете подскажите.
Очень интересное решениею

Clever · 04-07-2012, 22:17:40

Как и обещал , расскажу как можно использовать разные стили для разных экранов монитора без переключения , тоесть автоматически . Тут все намного проще чем кажется . Допустим у вас есть необходимость на экранах от 1024 до 1280 дать один вид сайта , для 1280 и выше второй . Делается это с помощью медиазапросов .

Пример:
<link rel="stylesheet" media="screen and (max-width: 1024px) , (max-width: 1088px) , (max-width: 1152px)" href="/templates/invest/style/1024_1280.css" />
<link media="screen" href="/templates/invest/style/1280_more.css" type="text/css" rel="stylesheet" />

Как использовать ? Берете ваш файл стилей , делаете из него копию , переименовуете , и дописываете медиазапрос между <head></head>

Спокойно правите файл (тот который создали) , и проверяете на разных экранах . Если все сделали правильно , то на разных экранах будет разные стили , хоть шапка , хоть цвет , что угодно.
Лучше всего проверять в опере , там есть ползунок для изменения разрешения.

Dexo · 05-07-2012, 08:44:40

Спасибо, вполне возможно что скоро эта информация понадобится.

Clever · 05-07-2012, 10:38:50

Там очень много возможностей , можно адаптировать под айфоны , принтеры , телевизоры , мобильные устройства , и еще много возможностей.

hatuns · 03-12-2012, 09:10:57

Цитата: hatuns от 04-07-2012, 09:01:10
Пожалуйста , если нужно могу подсказать как на разные экраны автоматически подставлять нужные файлы стилей , например у меня сейчас заказ , в котором нужно чтобы блоки типа голосование , календарь и тд при экранах от 1024 до 1280 были закрыты в блоки 50рх шириной и выезжали по клику , а после 1280 - были раскрыты , вот в таких ситуациях очень помогает ...

А как сделать чтобы блоки типа голосование , календарь и тд при экранах от 1024 до 1280 были закрыты в блоки 50рх шириной и выезжали по клику?

Clever · 03-12-2012, 11:59:38

Цитата: hatuns от 03-12-2012, 09:10:57
А как сделать чтобы блоки типа голосование , календарь и тд при экранах от 1024 до 1280 были закрыты в блоки 50рх шириной и выезжали по клику?

Сейчас только заметил что забыл в этой теме ответить , сам же предложил рассказать

Итак , чтобы до 1280 боковые блоки были закрыты , но при клике открывались , и при этом на 1280 и больше были всегда открыты , нам понадобится:
Приведу на примере как я выводил таким образом один из блоков , допустим голосовалку в дле:

<div class="votebl"></div> 
<div class="votehide">
<br />{vote} 
</div>
И небольшой кусочек квери. Поэтому нужно чтобы он был подключен для данного варианта
<script type="text/javascript">
$('.votebl').click(function(){
      $('.votehide').slideToggle(550);
      return false;
});
</script>

Вживую реализацию можно посмотреть здесь

Не забудьте что это появляется только на маленьком разрешении

hatuns · 03-12-2012, 15:32:58

Цитата: --- от 03-12-2012, 11:59:38
Сейчас только заметил что забыл в этой теме ответить , сам же предложил рассказать
Итак , чтобы до 1280 боковые блоки были закрыты , но при клике открывались , и при этом на 1280 и больше были всегда открыты , нам понадобится:
Приведу на примере как я выводил таким образом один из блоков , допустим голосовалку в дле:

<div class="votebl"></div> 
<div class="votehide">
<br />{vote} 
</div>
И небольшой кусочек квери. Поэтому нужно чтобы он был подключен для данного варианта
<script type="text/javascript">
$('.votebl').click(function(){
      $('.votehide').slideToggle(550);
      return false;
});
</script>

Вживую реализацию можно посмотреть здесь

Не забудьте что это появляется только на маленьком разрешении

Да посмотрел по ссылке, то что мне надо. Попробую реализовать сегодня вечером, как доберусь до домашнего компа. Правда у меня не дле и не знаю получится реализовать как вы описали.

Clever · 08-12-2012, 21:05:43

Цитата: hatuns от 03-12-2012, 15:32:58
Да посмотрел по ссылке, то что мне надо. Попробую реализовать сегодня вечером, как доберусь до домашнего компа. Правда у меня не дле и не знаю получится реализовать как вы описали.

Это можно реализовать на любом движке или без него , даже в html-сайтах , просто нужно чтобы квери библиотека была подключена , допустим одну из этих: