Jump to content

Diasouls

Newbie
  • Posts

    15
  • Joined

  • Last visited

About Diasouls

  • Birthday 05/19/1994

Information

  • Sex
    Мужчина

Diasouls's Achievements

Explorer

Explorer (1/14)

0

Reputation

  1. Прошу прощения, если не в ту тему запостил, не со зла Спасибо за ссылку - почитаю. Может у кого есть какие-нибудь мысли?)
  2. Это не к DNS записям))) Кажется, что это тестовый сайт и нежелательно же, чтобы он попал в индекс поисковиков
  3. Если по простому, то в файле style.css Измените: body > .navigation { display: none; background: #2D3642; } На вот это: body > .navigation { display: block; overflow: visible; background: #2D3642; } Если же хотите вообще убрать возможность сворачивания, то нужно уже выпиливать стили и js
  4. Проще заказать у кого-то из фрилансеров, если вы не обладаете знаниями в области, которую указал пользователь rus выше.
  5. Для начала уберите из css всё, что касается id(#). Это дурной тон, задавать стиль элементу через id (#) - используйте классы. Стоит еще рассказать вам, что id - это уникальное обращение к элементу, то есть на странице, по логике вещей, не может быть два элемента с одинаковым id. У вас же на странице два одинаковых id у блоков модуля. Назовите первый блок id="charms", а второй id="charms2". Измените ваш js в конце страницы на $(function(){ $("#settings").click(function (e) { e.preventDefault(); $('#charms').charms('showSection', 'theme-charms-section'); }); $("#test").click(function (e) { e.preventDefault(); $('#charms2').charms('showSection', 'theme-charms-section'); }); }); После этого у вас все будет замечательно, при условии, что вы исправите самое первое замечание Кстати, не обязательно использовать этот плагин, можно написать и самому на JQuery, намного короче.
  6. Скорее всего BOM. Было такое как-то раз.
  7. Всем доброго времени суток! Давайте сегодня поговорим о том, как подключать стили на проектах, где все файлы .css занимают больше 300-400кб. Вопрос появился после разговора с коллегами по профессии в паблике Хабрахабра в вк. Собственно сам вопрос: Как лучше подключать стили, если они имеют довольно большой объем? Речь пойдет про bootstrap + свой css. Словарь: bootstrap -> bs3 Да-да, матерый верстальщик скажет, что фу такую бяку юзать, лучше самому все написать. Но мы не ищем легких путей и думаю эта тема интересна всем тем, кто связан с этим по жизни. Однако, даже если убрать bootstrap, то все равно в любом проекте есть основные стили, а вокруг них танцуют другие Здесь собраны некоторые идеи комментаторов и мои соображения, а также что я думаю по той или иной идее: Идея #1. Модульная система. Разобрать bs3 и свой.css на модули и подключать их по необходимости. Плюсы: На страницах подключаются только необходимые "модули" -> меньше размер. После открытия всех типов страниц будет кэшированая полная версия стилей. Минусы: Одинокие .css файлы -> больше запросов к серверу, а это критично на мобильных устройствах. Небольшое замедление скорости разработки, из-за нарезки модулей. Идея #2. Основа и комплексные стили страниц. Разобрать все файлы стилей на модули. Определить все стили, которые используются на всех страницах сайта и собрать их в основной .css файл и подключать его, а дальше использовать комплекс стилей конкретной страницы, когда подключается второй файл со всеми стилями необходимыми для этой страницы. Плюсы: Меньший размер подключенных .css. Минусы: Скорость разработки медленная, из-за сборки стилей. Кэш будет раздут и для каждой страницы на 50% новый. Идея #3: Идея #1 и #2 в профиль. Тоже самое что и вторая идея, но использовать основу и вместо второго файла использовать модули стилей из первой идеи. Плюсы: Меньший размер подключенных .css. Больший шанс, что кроме основы, будет закэширован и какой-то из модулей. Минусы: Небольшое замедление скорости разработки, из-за выделения основы и модулей. Одинокие .css файлы -> больше запросов к серверу, а это критично на мобильных устройствах. Идея #4. Безумие по диагонали. А давайте сделаем основной .css файл, а для конкретной страницы будем в <head></head> писать <style>стили</style>. Плюсы: Один запрос к серверу. Хорошо сжимается gzip. Минусы: Скорость разработки малость пострадает, так как нужно выделить основу и инклудить стили в <head></head> Эстетика нарушена. Кэширование применимо только к основе. Идея #5. Хардкор. Оставить все эти теории и практики и подключить как всегда, одним файлом. Плюсы: Скорость разработки как всегда. Поддержка как всегда. Один запрос на все стили. 100% кэш. Минусы: Огромный размер файла стилей, что может привести к очень значительному времени загрузки страницы и его внешнему виду. Прошу не ругать за такой вопрос, если его где-то обсуждали. Честно - я не нашел. Жду ваших ответов и готов обсудить любой из вариантов. Любопытно все это мне
  8. Прошу прощения, если вдруг на форуме есть правило: одна тема - один вопрос! Скажу честно, но за пять с хвостиком лет верстки, я ни разу не пользовался Ajax, так что могу что-то не понимать, но это исправимо. Как я понял, из примера и документации, чтобы он был бесконечным, мне необходимо хранить в html все миниатюры постов, группируя их по несколько штук и это как мне кажется, очень затратно, если постов больше, допустим, тысячи.. Я думал сделать на ajax'e, который будет подгружать данные по мере прокрутки Может я ошибаюсь и пора бросить форум и сесть за книги?
  9. Всем спасибо за помощь! Решил все таки эту задачку при помощи masonry, на который натолкнул Justnewone. Переезд, конечно, прошел не без сюрпризов, но терпимо. Из проблем, наверное, стоит отметить, что все блоки наделяются свойствами абсолютного позиционирования и отправляются на свое место с помощью левого и нижнего отступов. Не знаю насколько это практично будет в перспективе, но высота родительского блока уже 4000 пикселей, что немного пугает. Однако, все, условно говоря - "новости", отсортированы и замечательно выглядят на ретиноподобных дисплеях, телефонах и планшетах. Даже ослик 7 нормально все отобразил. Осталось только исправить адаптивность по ширине и все будет замечательно. Еще раз спасибо!
  10. Хммм.. а это идея, но опять таки jquery... в принципе, скорее всего, я все равно буду где-то в проекте еще использовать его, так что без JS никак. Вроде и все современные мобильные телефоны нормально с ним работают, так что это вариант. *Самоубеждение* Все равно же при одноколоночном или двухколоночном "режиме" просмотра, необходимо будет сортировать материала из: 1_2_3 4_5_6 в двухколоночный: 1_2 3_4 5_6 и одноколоночный: 1 2 3 Ну если с версткой ничего не придумаю, то будет как вариант Спасибо!
  11. Спасибо, что откликнулись! Да, картинки то и не подумал, сейчас перезалью на хостинг. Да, так как это колонка, которая занимает треть блока, следовательно .span_2_of_3 - это 2/3 блока, может применяться как .span_1_of_3 и .span_2_of_3. Идею колонок почерпнул из сетки http://www.responsivegridsystem.com/
  12. Доброго времени суток, уважаемые форумчане! Есть у меня проблема, которую, как мне кажется, можно решить легко, но я уже слишком погрузился и не вижу очевидного, поэтому прошу совета у вас. Есть у меня макет, положил в миниатюры. Суть его в том, что материалы в нем бесконечные, будут подгружаться, но это другая песня. Сверстаны они вот так: <div class="section group"> <div class="col span_1_of_3"> <div class="postbox"> Пост номер один </div> <div class="postbox"> Пост номер четыре </div> </div><!-- Closing tag: .col--> <div class="col span_1_of_3"> <div class="postbox"> Пост номер два </div> <div class="postbox"> Пост номер пять </div> </div><!-- Closing tag: .col--> <div class="col span_1_of_3"> <div class="postbox"> Пост номер три </div> <div class="postbox"> Пост номер шесть </div> </div><!-- Closing tag: .col--> </div><!-- Closing tag: .section group--> Заданы свойства через css (два файла, так что запросы не объединены): .section{clear:both;margin:0;padding:0;} .group:before,.group:after{content:"";display:table;} .group:after{clear:both;} .group{zoom:1;} .col{display:block;float:left;margin:1% 0 0 1.6%;} .col:first-child{margin-left:0;} @media only screen and (max-width: 480px) { .col{margin:1% 0;} } .span_3_of_3{width:100%;} .span_2_of_3{width:66.1%;} .span_1_of_3{width:32.2%;} @media only screen and (max-width: 480px) { .span_3_of_3,.span_2_of_3,.span_1_of_3{width:100%;} } @media only screen and (max-width: 768px) { .span_1_of_3{width:100%;} } @media only screen and (min-width: 769px) and (max-width: 1024px) { .span_1_of_3{width:49.2%;max-width::400px; } } На телефоне они спокойно расходятся в ширину, на планшете в две колонки, но вот с планшетом беда. Сами колонки из трех становятся двумя, но материал из третьей колонки, становится второй и получается, что третья колонка получает многим больше материала, чем первая. (Миниатюра 2) Думаю вопрос уже все предугадали Как с этим бороться? У меня в голове пока две версии: 1) Пересмотреть верстку, но идеи пока нет каким образом 2) Перемещать элементы с помощью JS из второго столбца в первый, если их там больше чем половина плюс два. Вроде это возможно, судя по googlопоиску Так что прошу помощи у вас! Заранее спасибо! Миниатюра 1: http://hostingkartinok.com/show-image.php?id=552b58b26364f6c718d94de992c9ddd3 Миниатюра 2: http://hostingkartinok.com/show-image.php?id=dbb9530ca9258ef208ff3b252eefbb10
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy