Ateiri
-
Posts
21 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by Ateiri
-
-
Нашел одну из проблем. Дело было в объявленных классах. Добавил доп. классы col-xs-4 col-sm-4 col-md-4 col-lg-4 в последние 3 колонки и проблема разрешилась.
Единственное, что все еще испытываю косяки в IE7, последний столбец прилип ко второму.
-
Всем привет!
Опять взываю умы верстки! Решил сделать небольшое приложение, которое должно без проблем запускаться в IE7+ и других браузерах.
Решил использовать bootstrap для ускорения работы (на деле вру, но отступать уже поздно), ну и В общем то IE7, 8 в сторонке лежат и ножкой дрыгают, что делать господа? Выкладываю скриншоты и соус.
Предположим 3 колонки:
А вот результаты IE7-8 и Opera:
Изменили масштаб в Opera:
Соус:
Я пробовал html5shiv js, ie7 bootsrap fix css, respond js, boxsizing.htc, ничего не получилось
-
Элементы далеко друг от друга расположены, как то связь не ладится…
И вот ты крутишь-крутишь скроллер чтобы наконец увидеть футер с голубыми ссылками на темно-сером фоне…
В общем-то человек может и не дойти до футера и так не узнать ваш номер телефона)
-
http://prntscr.com/2cepr5 Видимо о этих иконках, относительно текста не по центру. Попробуйте background-position не top, а в px "подвигать".
Да-да, не успел ответить, спасибо))
-
Я не давно делал скрипт, который меняет картинку. Крутит баннеры каждые N секунд времени.
В общем если будет полезно:
HTML
<div id="bannerRoller"><img src="#" width="800" height="133" alt="Первая картинка"/><img src="#" width="800" height="133" alt="Вторая картинка"/><img src="#" width="800" height="133" alt="Третья картинка"/></div>
JS
var element; window.onload = function() { bannerScroll(); //banner roller } function bannerScroll() { var TIME = 7000; //time in ms between banner changing var ID = "bannerRoller"; //id of banner wrapper var element = document.getElementById(ID); var images = element.getElementsByTagName("img"); var start = 0; var current = start; var last = images.length-1; var status=0; //Loading first element images[start].style.display="block"; current++; //banner changing if (images.length==1) { return; } else { setInterval(function() { if (current==start) { images[last].style.display="none"; images[current].style.display="block"; current++; } else if (current<last) { images[current-1].style.display="none"; images[current++].style.display="block"; } else { images[current-1].style.display="none"; images[current].style.display="block"; current=start; } }, TIME); } }
-
А вот в это я не поверю пока не увижу.
Может мы о разных вещах говорим?
Я немного переделаю скрипт, чтобы он заменял блок в хроме и пришлю скриншот с кодом)
Верно, может я огляделся) В хроме все меняется)
-
Я это вижу, что шрифты разные и дело не в рендеринге. Подключение используется предоставляемое гуглошрифтами. Фиг сним, забили уже..
Не отказываетесь от идеи, у вас все получится.
http://xandeadx.ru/blog/css/489
Раздел «Зачем там много форматов», смотрите таблицу.
http://www.xiper.net/collect/html-and-css-tricks/typographics/font-face-in-the-details.html
-
Мне очень нравится ваш дизайн, легкий, удобный.
Я бы поправил заголовки, а именно: убрал отступ слева и увеличил бы отступ снизу. Так может имеет смысл внести разнообразие в шрифты? Хотя бы сделать различие между теми же заголовками и обычным текстом.
Вы очень утяжелили меню… Лично я, во всех своих работах исключительно использую ul li. Средства css + js позволят исправить ошибки отображения в других браузерах.
Иконки у меня находятся не по центру.
А так весьма вкусно
-
Продолжу в вашей теме, если не возражаете? PT Serif Caption от Google Webfonts в IE7-8 отображается на странице не так, как ожидалось: Почему так?
Это совершенно 2 разных шрифта. Вы уверены, что шрифты подключены верны? Опять же поплюем в сторону IEшек…
Почитайте статьи про хаки IE с подключением шрифтов.
В общем хотелось бы увидеть вашу верстку, скорее всего у вас более глобальные проблемы :-) И странно, что с жесткими размерами у вас проблемы только со шрифтами :-)Пока что ограничусь скриншотами. А если хотите взглянуть на код, то можете написать мне лично в skype
p.s. Я открыл новую тему в разделе javascript. Это ответит на вопрос почему в IE6 у меня написано hello world
http://htmlforum.ru/index.php?showtopic=47103
А насколько жестко требование точного соответствия левого отступа? Нельзя ли просто «прибить» меню к правому краю (ограниченному максимальной шириной)? На мой взгляд, при таком дизайне это просто напрашивается и было бы намного логичнее...Я вас прекрасно понимаю и я бы с радостью перерисовал шаблон id+ps и добавил гибкости, но мне руки оторвут быстрее.
-
Это особенности девелопер тулзов от Microsoft - они дерьмовые.
Дык, хром тоже не показывает как и остальные браузеры.
-
Ну стили стандартные, точно не в них дело. Алерт выдает с тегами.
Меня очень смутил факт, что при просмотре исходного кода, эти 2 новые строки не упоминаются вообще, а старый контент не смотря на его визуальное отсутствие, в коде прописан.
Т.е. это чисто клиентские операции... Я что-то совсем ничего не понимаю.
Я приношу свои извинения! Действительно все прекрасно работает и я совсем не учел файл reset.css, который обнулял h1-h5 теги и.т.п.
-
Во-первых, зачем вам ИЕ6? Спортивный интерес? По моим данным (штук пять сайтов с около миллиона зарегистрированных пользователей) доля ИЕ6 равна нулю. Во-вторых, какая реакция вам требуется? Из вашего описания это непонятно. Да responseText возвращает plain text, но при вставке через innerHTML он превращается в DOM-элементы. В третьих, оба решения (JS и PHP) ущербны. ИЕ6 и так медленный браузер (скорость JavaScript там оставляет желать лучшего), а вы еще и мега-перестройку DOM там затеваете, а это одна из самых дорогих операций в браузере. Почему бы просто не использовать conditional comments? Это будет быстрее во много раз и правильней.
Мне поставили такую задачу, IE6 и все, ничего личного.
А я ведь даже заново переписывал, чтобы объяснить как можно проще. Хорошо, еще раз.
Взгляните на второй скриншот. Там где <p><h1 и т.п. (2 строки). Ага, вот именно эти 2 строки будут вместо блока слева.
Посмотрите, эти 2 строки совершенно игнорируют свои html-теги, на выходе лишь plain text. А самое удивительное, alert(obj.innerHTML) выводит строку с тегами так, как надо.
Что же получается, innerHTML не пашет?
-
Привет всем-всем!
В общем цель, написать валидный, а так же кроссбраузерный сайт с IE6 включительно.
IE6 эхом отдается в моей голове и я уже не первый день ругаюсь в поисках решения.
У меня были проблемы с отображением блоков в IE6, но совершенно не хотелось верстать таблицами и прочими дьявольскими методами.
Да-да, я решил написать JS, который должен найти dom-элемент по id (блок) и заменить его содержимое, содержимым из файла notify.html.
Мое рассуждения свелись к XMLHttpRequest. Именно он играет важную роль в загрузке нашего html файла.
function readFile(file,callback,cache) { var rawFile = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"); rawFile.open('GET', file+(cache=(cache===true) ? '?r='+Math.random() : ''), true); rawFile.onreadystatechange = function() { if(rawFile.readyState===4) { if(rawFile.status===200||rawFile.status==0) { args={}; callback.call(rawFile.responseText, args); } } } rawFile.send(null);}
Первый аргумент в функции это путь к нашему файлу, второй callback, третий убирает кеширование добавление ?r=рандомное число.
Мы запускаем нашу callback функцию в контексте rawFile.responseText и на всякий добавляет args аргументы.
Функция определения браузера <IE6.
function findIE6() { if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)){ var ieversion=new Number(RegExp.$1); if (ieversion<=6) return true; }}
Прелестно, теперь <IE6 в рукаве, идем дальше.
Функция записи/замены контента в блок с ID.
function setContent(id) { var obj = document.getElementById(id); obj.innerHTML=this;}
obj.innerHTML=this рассмотрим дальше.
Функция scriptLoader можно назвать init'ом на нашем сайте.
Данная функция просто запускает другие.
function scriptLoader() { if(findIE6()==true) { readFile('/ie6/notify.html', function() { setContent.call(this,'notify'); }, true); } } scriptLoader();
Ну собственно если IE6 найден, выполняем нашу функцию readFile.
Опять же, первый аргумент это путь к файлу, второй аргумент это callback функция, которая запускается в контексте rawFile.responseText (помните?), а функция внутри setContent, запускается в контексте нашей обертки.
По сути я сам боюсь даже это объяснить, exp'ы не хватает, но суть в obj.innerHTML=this, где this и есть наш rawFile.responseText.
__________________________________________________________________________________________________
Ладно-ладно, помудрили и хватит. Все действительно работает, загружается, вставляется, НО вставляется исключительно PLAIN TEXT.
Т.е. на html элементы реакции нет. Для наглядности вышлю скриншот.
p.s. Скорее всего проблема в том, что сама по себе data является текстовым узлом и никак не ассоциируется с dom элементами. Следовательно нужно написать html парсер.
Что скажите господа и дамы, есть идеи?
Заранее благодарю!
Мне кажется или решение с php будет удобнее и быстрее во всех смыслах...
-
Увы, в данном случае моя верстка ограничена жесткими размерами.
-
Прозрачность на фоне используете?
Я думаю вам нужен pngFix, http://stackoverflow.com/questions/2441767/ie6-png-transparency-fix-with-backgroud-positioned
-
кроссбраузерно
!= pixel-perfect
Зависимость верстки от ширины текста === некроссбраузерно. Потому что есть еще Мак и Андроид (с прочими Линуксами), где рендеринг шрифтов отличается по-настоящему. Кроссбраузерная верстка обязана не ломаться даже в этом случае, поэтому всегда должен быть запас.
Но вообще хотелось бы увидеть это чудо. По логике, отличаться при правильном доктайпе должен как раз IE9+...
Посмотрите на скриншоты, а именно меню. Мне нужно отступ перед меню (выполнено) и мне нужно чтобы все эти элементы-ссылки умещались. Из-за широкого шрифта в IE 6.0, ссылка в меню переползает на вторую строку (в данном примере переползания нет). Переползание происходит из-за нехватки места, но я устранил это следующим образом:
white-space:nowrap;
Так как у меня именно эмулятор IE, масштабирование мне недоступно, но теоретически ссылка может вообще выйти за пределы нашего навигационного блока. В этом то вся и лажа.
В любом случае хочется услышать следующее, мое решение имеет место или все же есть иные, более безопасные способы? (на будущее).
-
Это что-то новое. Что именно «ломается»? И какой размер шрифта указан, в каких единицах?
Под «ломается» имеется ввиду, что шрифт не соответствует отображению всех остальных браузеров, включая IE 9+.
Шрифт Verdana, размер пробовал и в pt/px/em задавать, результат тот же.
Как уже писал, в QM IE6-9 работает нормально, но QM сама по себе штука мерзкая.
И не надо! Надо разобраться в причине проблемы. Хотя вообще в 2013-м вполне достаточно идеального отображения в IE9+ и всём современном, а в IE8- достаточно, чтобы текст просто читался. Уже доля мобильных браузеров в разы больше, чем старых IE.Цель: сверстать кроссбраузерно. IE начиная с версии 6.0.
В общем проблема не решаема. Все сайты с якобы нормальными шрифтами были в quirk mode, а так как такое «мерзкое» чудо я себя позволить не могу, то и единственным решением выравнивания ширины текстового узла будет letter-spacing для ie6-8
Всем спасибо.
-
Действительно, дело в доктайпе. <!DOCTYPE html> ломает ie6-8.
И все же неужели нет вариантов как все это исправить? Писать без доктайпа тоже не могу)
-
Посмотрите на то как прорисована цифра 4 в номере. Посмотрите какой ширины текстовый узел c почтой в разных IE.
Конечно я идеалист и желаю исправить все все все)))
В интернете нашел один табличный сайт и так же решил его проверить на ie6-9. Шрифт не изменился. Кодировка windows-1251.
Кодировка действительно не имеет отношения, это уже факт. Остается «винить» (если так вообще можно сказать) блочную верстку (vs табличную).
Попробую проверить текст в табличной, блочной верстках.
-
Здравствуйте, дамы и господа!
Сразу с «жалоб». Уже не первый месяц и не в первом проекте сталкиваюсь с проблемой рендеринга шрифта в IE6-8.
Шрифт абсолютно по-разному отображается в IE6-8 и в IE9+/Chrome и т.п.
Перечитал массу статей, свожу все к кодировке UTF-8, но больше меня интересует решение данной проблемы.
Если кто-нибудь знает ответ или же имеет схожую проблему, добро пожаловать на обсуждение!
P.S.: На скриншотах обратите внимание на ширину букв. Шрифт Verdana.
з.ы.: надеюсь администрация простит меня за прямые ссылки =P
Bootstrap 3 и IE7+
in HTML Coding
Posted
Спасибо, обязательно попробую