Как узнать что у пользователя отключены картинки ?
Всем привет.
Пишу меню на картинках, а если они отключены, то хочу не сдвигать текст. Как из JS узнать что отключены картинки? Спасибо. |
img_load=false; document.getElementsByTagName('img')[0].onload=function( img_load=true; ){} window.onload=(){ if(img_load==false){ //картинки не загружены } } возможно как-то так но не уверен а проверять лень сейчас только мне кажется что ваша проблема(хотч не могу сказать точно, так как вы почти ничего не сказали о ней) решается правильной версткой |
Спасибо Gvozd работает Ваш метод.
У меня пункт меню - картинка, которая идет фоном divа, а текст в диве сдвинут на left=-9999px (метода - с сайта Попова). Там говорят надпись нужна для поисковых роботов да и если картинки отключены - сделаю left=5px, чтоб видно что-то было пользователю. И еще вопрос чтоб тему не создавать новую в этом же контексте. Вот код: function two() { var obj=document.getElementById('yyy');// div - пункт меню if (obj) { var img=new Image(); img.src='bfon30.jpg'; // та картинка что нужна //alert(img.width); //- по умолчанию верные размеры //alert(img.height); obj.style.height=img.height+'px'; // Задаю ячейке obj.style.width=img.width+'px'; // верные размеры obj.style.backgroundImage='url("bfon30.jpg")'; // вставляю фон ячейке } } Так появляется нормально позиционированный пункт меню. Одно беспокоит : var img=new Image();img.src='bfon30.jpg';//(1) - здесь я подгрузил уже в браузер картинку, а тут: obj.style.backgroundImage='url("bfon30.jpg")';//(2) походу второй раз будет грузиться картинка? Или нет(может быть в буфере браузера она уже)? Хотелось бы как-то назначить второму первое. |
Цитата:
для того чтобы гарантировать что картинка будет загружена к моменту выполнения второго кода, надо поместить его в обработчик события onload объекта рисунка вопрос в том, что даже в таком случае нельзя гарантировать что браузер не полезет скачивать рисунок по второму разу гарантировать можно только в случае, если создан HTML-объект рисунка, и затем вставляется в DOM-дерево можно повысить шанс кеширования, при помощи заголовков с сервера только у меня вопрос по этому коду: зачем нужен код (1)? по сути ничего полезного в данном контексте он не делает кеширование в пределах одного блока просто не сделает пользы, даже если бы оно имело место быть Цитата:
|
Цитата:
Я пишу класс чтоб в него добавлялись только такие данные: уровень меню(к кому относится), фон(наша картинка), текст, ссылка на обработчик. Только такие данные заносятся и obj.vivodmenu(); - меню готовенькое на экране.(пока только 3-ех уровневое - думаю больше не надо) Пункт меню у меня - картинка с надписью, и узнать величину блока div {position:absolute} можно только по размерам картинки: var img=new Image(); img.src='bfon30.jpg'; obj.style.height=img.height+'px'; для этого создаю картинку. 2) Если бы картинка шла не фоном, я бы добавил в див картинку потомка и написал: newimage.src=img.srcиспользовал бы уже загруженную. А тут obj.style.backgroundImage='url("bfon30.jpg")'; нужно backgroundImage передать строку и как загруженную уже картинку использовать не знаю. |
Цитата:
Цитата:
я же написал, что гарантировать это нельзя.особенно, если вы не помещаете этот код в обработчик события onload рисунка-прелоадера Цитата:
obj.style.backgroundImage='url("'+img.src+'")'; но загрузку из кеша гарантировать все равно нельзя впрочем как и предзагрузку(что рисунок будет получен до того момента, как мы решим выяснить его размеры) лучше всего делать так(на кеширование пофиг, но зато вычисление размеров будет верно работать когда на сервер поместите свой код) function two() { var obj=document.getElementById('yyy');// div - пункт меню if (obj) { var img=new Image(); img.onload=function() { //тут рисунок уже гарантировано загружен, и можно выяснять его размеры //тут создается замыкание, и поэтому img продолжает быть видимым //alert(img.width); //- по умолчанию верные размеры //alert(img.height); obj.style.height=img.height+'px'; // Задаю ячейке obj.style.width=img.width+'px'; // верные размеры obj.style.backgroundImage='url("'+img.src+'")';// вставляю фон ячейке } img.src='bfon30.jpg'; // та картинка что нужна } } |
Да так буду делать.
У меня кнопки будут инициализироваться по ходу анализа страницы ( <javascript> в head). Там буду создавать объект и в нем new Image. А вывод меню будет в onload body. onload body - это же последнее событие когда все onload элементов уже отработали, или это только для элементов документа, а не new Image()? |
Цитата:
погуглите в любом случае, событие загрузки может наступить до загрузки вообще какого-либо из рисунков. по нажатию кнопки "остановить" пользователем поэтому лучше подстраховатся даже в таком случае я не совсем понял как вы собираетесь организовать код? в таком виде, главное чтобы ваша функция two() вызывалась после того, как появится упоминаемый в ней div остальное-необязательно |
Все спасибо, дальше уже сам.
Меню на основе текста в дивах уже у меня написано, теперь хочу с картинками поуниверсальней (как на сайте http://www.eurovision.tv/page/news/moscow2009) |
Часовой пояс GMT +3, время: 21:55. |