http://trifler.ru/blog/ Lasto Blogging Engine ru gordi serg_gordi@mail.ru serg_gordi@mail.ru http://trifler.ru/blog/i/lastoblog.png http://trifler.ru/blog/ http://trifler.ru/blog/post_1237217485.html <p>Продолжая занимательные эксперименты с <em>position:fixed;</em> без упоминания его самого в таблице стилей, прихожу к мысли, что тема сама по себе очень интересная, но на мой взгляд, совершенно не заслуженно обделена вниманием, как верстальщиков, так и <em>W3C</em>. Этому есть ряд причин, вот и откроем карты, основываясь на <a href="http://trifler.ru/blog/comment_1225998098.html">"position:fixed; - эмуляция Gordi"</a>.</p> <p>Это не окончательный релиз :) и многосериальное "кино" ждет своего продолжения.</p> <p>Всех, кто напрочь отметает саму возможность, в той или иной редакции, использовать фиксированные блоки на <em>web</em>-странице, просьба не беспокоится и не читать дальше.</p> <p>Другое дело, что проблемы возникающие при использовании предлагаемого вам приема, требуют не стандартного подхода в его решении и человеку далекому от истинного понимания сути вопроса, заниматься этим в лучшем случае, просто потратить напрасно свое время, так и не найдя правильного пути к достижению поставленной задачи.</p> <p>Это не просто слова.</p> <p>Не переоцениваю свои познания в этой области, так же, как и в области эмуляции равной высоты колонок, но едва ли где-нибудь еще вы найдете столько материалов по данным темам с многочисленными, достойными всяческого подражания примерами.</p> <p>Страницы блога, посвященные этим вопросам, дадут вам богатую пищу для размышлений, и если вы ищущий, думающий человек, а не просто <em>робот</em> с единственной зашитой программой то, привнеся, что-то от себя, разбираясь не в столь уж и сложных хитросплетениях <em>html</em>-кода и стилей, получите массу положительных эмоций. А приобретенный опыт, как нельзя лучше поможет в будущем при решении других, не менее сложных задач.</p> <p>Понятно, кое-кто может не согласиться, но спросим не согласных, что же вы милые мои не уделили этим вопросам толику своего драгоценного времени, если все так просто?</p> <p>Вам это не надо?</p> <p>А может быть дело совсем в другом?</p> <p>Вы этого не умеете и не знаете, как это сделать и в этом так трудно признаться даже самому себе?</p> <p>Скорее всего, так оно и есть.</p> <p>Ни в коей мере не даю оценки вашим знаниям соответствующих теме документов, разбуди ночью, как "Устав караульной службы" оттарабаните на память, нисколько в этом не сомневаюсь.</p> <p>Но поверьте, этого мало.</p> <p>Вернемся к более привычным для нас вещам.</p> <p>Для начала забавный скриншот.</p> <img src="i/layouts/fixed/w3c.png" style="display:block;margin:10px auto;width:453px;height:556px;" alt="w3c"> <p>Думаю, при использовании предложенного мной метода у вас никогда не будет подобных разочарований. Открыв эту <a href="http://www.w3.org/TR/WCAG20/">страницу</a> сможете, сами убедиться и в живую посмотреть, как "любимая" контора, <em>лажается</em> по полной программе. Горизонтальная прокрутка с превеликой радостью поможет вам в этом при уменьшении размеров окна браузера.</p> <p>Собственно, в том, что предлагается вам, вся проблема только в OPERA, не понимает она индивидуального указания – <em>overflow-x</em> или <em>overflow-y</em>, причем в 9.23 в отличии скажем от 9.5, картина меняется, в младшей версии есть горизонтальная прокрутка, а в старшей версии напрочь отсутствует.</p> <p>Странный все-таки это браузер, не смотря на прохождение самых <em>крутых, наворченных</em> тестов и получая вполне/не вполне заслуженные оценки, в простых вещах, а это касается не только темы данной статьи, где нет и намека, на какой либо криминал, ведет себя явно не достойно.</p> <p>Не буду приводить <em>html</em>-кода и стилей, там все более или менее прозрачно.</p> <p>Предлагаю <a href="http://shopblack.ru/cat_lasto.com.html">посмотреть</a> реализацию в формате скрипта Мастера Lasto для магазина "MultiAgent".</p> <p>Это одна из ранних версий эмуляции <em>position:fixed;</em>, где издержки OPERA очевидны и он/она в который раз теряет свое лицо :), нет горизонтальной прокрутки при уменьшении размеров окна браузера.</p> <p>Замечу для пользователей скриптов Мастера, нет смысла передирать этот вариант, хотя можете попытаться :), дизайн и его структура, многие вещи и детали оформления спрятаны под <em>зенд</em> и вы будете крайне разочарованы, взяв все один в один :)</p> <p>Но подобного рода дизайн в данном цветовом решении для скриптов - <em>Agent, MultiAgent, nano-CMS</em> и <em>blog</em>, находится у Вадима, и возможно вскоре они будут выставлены в его шопе.</p> <p>Также предполагается, продолжение линейки в этом стиле с различным расположением фиксированной колонки (колонок) для тех же скриптов.</p> <p>Желающие, заказать нечто подобное для <em>Portator</em>-а, обращаются лично ко мне, тут все будет строго индивидуально, думаю на нынешнем этапе, этот скрипт выходит из моды, но все возможно…</p> <p>Вернемся к проблеме горизонтальной прокрутки в OPERA.</p> <p>Лучшим решением было бы оставить все, как есть.</p> <p>Но…</p> <p>Из представленных <a href="fixed.html">примеров</a> вы сможете выбрать любой, а что до OPERA тут решать вам. По мне так, вообще его надо исключить из списка <em>"нормальных"</em> браузеров, как это ни печально. Потому что ни одна из предложенных уловок не может полностью устроить.</p> <p>Следуя инструкциям, расположенным на тестовых страницах, вы сможете убедиться в этом сами.</p> <p>Ну не писать же, в самом деле, из-за этого под каждый браузер собственные стили.</p> <p>А может, кому-то и удастся, к всеобщему удовольствию, найти решение.</p> <p>P.S. Размещение контейнеров <em>header, middle, footer</em> и сто процентная высота страницы с минимальной вертикальной прокруткой, в ней по вполне понятным причинам есть необходимость, выполнены по блочно-модульной концепции <a href="http://trifler.ru/blog/comment_1229535735.html">"Техника Gordi"</a> и мало распространенной <a href="http://trifler.ru/blog/comment_1230293406.html">методике</a> прижатия <em>footer</em>-а (вариация) к нижней границе окна браузера, соответственно.</p><!-- RSS_link_to_post start --> <br> <div style="margin-left:10px;color:#575;font-weight:bold;"><a href="http://trifler.ru/blog/post_1237217485.html">Оставить комментарий</a></div> <div style="margin-left:10px;color:#575;font-weight:bold;"><a href="http://trifler.ru/blog/post_1237217485.html">All Comments</a></div> <!-- RSS_link_to_post end --><!-- RSS_link_to_post start --> <br> <div style="margin-left:10px;color:#575;font-weight:bold;"><a href="http://trifler.ru/blog/post_1237217485.html">Оставить комментарий</a></div> <div style="margin-left:10px;color:#575;font-weight:bold;"><a href="http://trifler.ru/blog/post_1237217485.html">All Comments</a></div> <!-- RSS_link_to_post end --> Mon, 16 Mar 2009 21:31:25 GMT