Так вроди браузер подгружет все что написано в css почему тогда бывают тормоза при смене картинки?
.menubloc1_0{
background:url(../images/admin_0.png) no-repeat 0 0;
padding:0 0 25px 0;
}
.menubloc1_1{
background:url(../images/admin_1.png) no-repeat 0 0;
padding:0 0 25px 0;
}
<div class="menubloc1_0" OnMouseOver="this.className='menubloc1_1';document.getElementById('id_1').className='menucolor-in'" OnMouseOut="this.className='menubloc1_0';document.getElementById('id_1').className='menucolor-out'">
Видимо прийдется предзагрузку делать на JS?
Спустя 12 минут, 24 секунды (15.08.2011 - 17:43) Michael написал(а):
да, предзагрузку
var im = new Image();
im.src = '...';
Спустя 2 минуты, 1 секунда (15.08.2011 - 17:45) sebastjan написал(а):
Я думаю не обязательно предзагрузку на яваскрипт.
По идее должен броузер подгрузить.
Попробуй сохранить на декстопе страницу и посмотри есть ли в папке скрытая картинка.
По идее должен броузер подгрузить.
Попробуй сохранить на декстопе страницу и посмотри есть ли в папке скрытая картинка.
Спустя 4 минуты, 20 секунд (15.08.2011 - 17:50) sebastjan написал(а):
Да вот, протестил, сохраняет броузер картинки на невидимых слоях.
случаем не стоит в заголовке чтоб не хешело?
случаем не стоит в заголовке чтоб не хешело?
Спустя 2 минуты, 3 секунды (15.08.2011 - 17:52) Xes написал(а):
зайди на listhotel.ru наведи на меню справа картинки гдето 0.3- 0.5 секунд думают прежде чем появиться.
Зделано на смене класса css как в примере.
Зделано на смене класса css как в примере.
Спустя 51 секунда (15.08.2011 - 17:52) Xes написал(а):
я читал седння что люди именно через ксс предзагрузку делаютпримерно таким же образом но что то не работает.
Спустя 53 секунды (15.08.2011 - 17:53) sebastjan написал(а):
Проверил и на сервере, сохранение картинки на невидемом слое работет.
Так что яваскрипт может не понадобиться.
ищи в другом месте тормоза.
Так что яваскрипт может не понадобиться.
ищи в другом месте тормоза.
Спустя 2 минуты, 2 секунды (15.08.2011 - 17:55) sebastjan написал(а):
Имеешь ввиду птичка меняет фон?
Спустя 49 секунд (15.08.2011 - 17:56) sebastjan написал(а):
У меня без тормозов, сразу всё работает и человечек сразу меняеться.
Спустя 46 секунд (15.08.2011 - 17:57) sebastjan написал(а):
Всё работает.
Это у тебя локально что то броузер тормозит или комп
Это у тебя локально что то броузер тормозит или комп
Спустя 1 минута, 19 секунд (15.08.2011 - 17:58) imbalance_hero написал(а):
sebastjan
Видимо у тебя слишком быстрый интернет
А вообще - да, надо подзагрузку делать, иначе будет такой глюк, как описал ТС.
А вообще, можно подгружать картинки в самом начале на страницу, либо в скрытый блок, либо 1х1 пиксель.
Видимо у тебя слишком быстрый интернет
А вообще - да, надо подзагрузку делать, иначе будет такой глюк, как описал ТС.А вообще, можно подгружать картинки в самом начале на страницу, либо в скрытый блок, либо 1х1 пиксель.
Спустя 1 минута, 59 секунд (15.08.2011 - 18:00) Xes написал(а):
Ну ладно успокоил, пока не буду трогать их. Подгружу тольок стрелочки ктоторые ни где не прописаны.
Спустя 4 минуты, 14 секунд (15.08.2011 - 18:04) sebastjan написал(а):
Первое получение картинки может занять время а это да.
Но потом броузер берёт из хеша, попробуйте сохраните эту страницу локално и увидите в папке с картинками все картинки , даже если вы и не наводили курсор на изменяемую картинку.
Я проверил , загрузил на сервер файлик с скрытой картинкой, открыл страницу, сохранил, в папке картинка лежит.
По сути яваскрипт делает тоже самое что и ЦСС файл.
Можно и в голову хтмл файла всунуть скрытый слой с картинкой, будет тоже самое.
Но потом броузер берёт из хеша, попробуйте сохраните эту страницу локално и увидите в папке с картинками все картинки , даже если вы и не наводили курсор на изменяемую картинку.
Я проверил , загрузил на сервер файлик с скрытой картинкой, открыл страницу, сохранил, в папке картинка лежит.
По сути яваскрипт делает тоже самое что и ЦСС файл.
Можно и в голову хтмл файла всунуть скрытый слой с картинкой, будет тоже самое.
Спустя 4 минуты, 11 секунд (15.08.2011 - 18:09) sebastjan написал(а):
Хеш очистил в броузере, зашол на страницу, всё вылетает пулей.
Косяк может быть если яваскрипт напортачил.
По сути если инет тормозил бы ,то фоны страницы вообще долго грузились.
А фоны без глюка вылетают.
Так что можно косить на явасрипт.
Хотя у меня и яваскрипт без проблемм работает.
Косяк может быть если яваскрипт напортачил.
По сути если инет тормозил бы ,то фоны страницы вообще долго грузились.
А фоны без глюка вылетают.
Так что можно косить на явасрипт.
Хотя у меня и яваскрипт без проблемм работает.
Спустя 2 минуты, 11 секунд (15.08.2011 - 18:11) Xes написал(а):
Тобишь шоб не париться с js делаю div чик сую в него все картинки что будут у меня на этой стрнанице (мелкие) и делаю ему display:none ? Ша отпробуем.
---
Ни понятно уже толе лучше толи нет. Смысл вобщем понятен попробую позже с серваком когда сайт перезалью, если не поможет то явой сделаю.
---
Ни понятно уже толе лучше толи нет. Смысл вобщем понятен попробую позже с серваком когда сайт перезалью, если не поможет то явой сделаю.
Спустя 55 секунд (15.08.2011 - 18:12) sebastjan написал(а):
Да.
Спустя 4 минуты, 26 секунд (15.08.2011 - 18:16) sebastjan написал(а):
Я так раньше делал, особенно для галерей актуально, зашол на страничку превьеш, пока расмотрел, всё и подгрузилось в броузер.
Так что при клике на превьюшку всё вылетет в мгновение.
Был у меня глюк с компом, написал на яваскрипт динамическое передвижение слоя, а оно работало как заяц, прыжками, весь инет перекопал, думал что плохо яваскрипт написал, потом случайно выяснил что это мой комп накрылся, яваскрит не мог по человечески интерпритировать не на одном броузере, наверное дело было в график карте.
Давно это было.
Так что при клике на превьюшку всё вылетет в мгновение.
Был у меня глюк с компом, написал на яваскрипт динамическое передвижение слоя, а оно работало как заяц, прыжками, весь инет перекопал, думал что плохо яваскрипт написал, потом случайно выяснил что это мой комп накрылся, яваскрит не мог по человечески интерпритировать не на одном броузере, наверное дело было в график карте.
Давно это было.
Спустя 22 минуты, 15 секунд (15.08.2011 - 18:38) redreem написал(а):
display:none если сделать - как раз таки картинки не подгрузятся. тогда уж visibility:hidden надо.
Спустя 25 минут, 51 секунда (15.08.2011 - 19:04) sebastjan написал(а):
| Цитата (redreem @ 15.08.2011 - 15:38) |
| display:none если сделать - как раз таки картинки не подгрузятся. тогда уж visibility:hidden надо. |
спасибо,просветил.
display:none ни разу не приходилось пользоваться.
Спустя 14 часов, 19 минут, 15 секунд (16.08.2011 - 09:24) Michael написал(а):
| Цитата (sebastjan @ 15.08.2011 - 17:04) |
| Первое получение картинки может занять время а это да. |
Так он про это и говорит, про первое получение картинки, а ты - "все нормально, все работает"...
На js такие вещи делаются обычно, запрос на получение в кеш браузером картинки которая используется отсроченно. У него в цсс картинка прописана в стиле, который не используется на странице - вот картинка и не грузится.
Спустя 1 час, 58 минут, 25 секунд (16.08.2011 - 11:22) kirik написал(а):
Чёт вы мутите.. нафига тут js? Решается обычным (или необычным) css спрайтом.
Xes, а то что ты намутил с OnMouseOver и OnMouseOut решается псевдоклассом :hover в css'е.
Xes, а то что ты намутил с OnMouseOver и OnMouseOut решается псевдоклассом :hover в css'е.
Спустя 5 часов, 53 минуты, 37 секунд (16.08.2011 - 17:16) sebastjan написал(а):
| Цитата (Michael @ 16.08.2011 - 06:24) | ||
Так он про это и говорит, про первое получение картинки, а ты - "все нормально, все работает"... На js такие вещи делаются обычно, запрос на получение в кеш браузером картинки которая используется отсроченно. У него в цсс картинка прописана в стиле, который не используется на странице - вот картинка и не грузится. |
Михаил мне кажеться вы ошибаетесь, если картинка прописанна в ЦСС , она будет подгруженна броузером.
Яваскрипт выполеяет практически ту же функцию.
Можете проверить , сохранить страницу со скрытой картинкой, и посмотреть в папку с картинками, она там будет.
что касаеться первого получения картинки, я написал своё мнение, те картинки о которых говорит автор темы, маленькие по весы, и выскакивают практически сразу, еслиб они грузились долго, то картинки фоны на странице, которые гораздо больше, грузились бы вообще невероятно дольше.
Так что вопрос про проблемму первой загрузки, думаю отпадает.
Спустя 14 часов, 18 секунд (17.08.2011 - 07:16) Michael написал(а):
sebastjan, сделал такую страницу и в firefox в Инструменты->Информация о странице->Мультимедия(*) картинки нет. Яваскриптом в консоли назначаю класс(в котором бэкграундом картинка) - она появляется в (*).
Спрайты - это другой путь решения для подобного функционала, но не решение текущей проблемы в топике.
Спрайты - это другой путь решения для подобного функционала, но не решение текущей проблемы в топике.
Спустя 2 часа, 29 минут, 15 секунд (17.08.2011 - 09:45) Xes написал(а):
| Цитата (kirik @ 16.08.2011 - 08:22) |
| Чёт вы мутите.. нафига тут js? Решается обычным (или необычным) css спрайтом. Xes, а то что ты намутил с OnMouseOver и OnMouseOut решается псевдоклассом :hover в css'е. |
Я не помню но чтото не получалось. Помоему ховер не работал для diva в IE вообщем была тут моя же длинная тема по этому вопросу.
Шас пока решил просто функционал накидать на сайт, буду отлаживать вернусь ко всем своим темам позже.
Спрайты тоже не пойдут див не жесткий.
Спустя 6 часов, 16 минут, 47 секунд (17.08.2011 - 16:02) sebastjan написал(а):
Michael
Михаил наверное надо немного нам уточнить,
вариант первый.
Если на невидимом слое использовать картинку как бг-фон, то до она не будет сохранятья броузерами , такими как фарефокс, Ие. - опера сохраняет.
А вот такой вариант сохраняет всеми броузерами, ну по крайней мери , ИЕ, Фарефокс, Опера.
В общем на сколько понятно из публикаций, мелкие элементы решаються спрайтами, хотя я не использую.
Хочу повторить, я проблеммы не заметил, на ИЕ, лисе, Опере у меня всё хорошо,
наводишь на меню, смена картинки без заедания.
Михаил наверное надо немного нам уточнить,
вариант первый.
Если на невидимом слое использовать картинку как бг-фон, то до она не будет сохранятья броузерами , такими как фарефокс, Ие. - опера сохраняет.
А вот такой вариант сохраняет всеми броузерами, ну по крайней мери , ИЕ, Фарефокс, Опера.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Untitled Document</title>
<style>
.m{height: 200px; width: 200px; visibility: hidden;}
</style>
</head>
<body>
xxxxxxxxxxxxxxxxxxxxx
<div class="m"><img src="img/xxx.jpg"></div>
</body>
</html>
В общем на сколько понятно из публикаций, мелкие элементы решаються спрайтами, хотя я не использую.
Хочу повторить, я проблеммы не заметил, на ИЕ, лисе, Опере у меня всё хорошо,
наводишь на меню, смена картинки без заедания.
Спустя 1 час, 20 минут, 42 секунды (17.08.2011 - 17:23) Michael написал(а):
| Цитата (sebastjan @ 17.08.2011 - 15:02) |
| Michael Михаил наверное надо немного нам уточнить, |
А чего тут уточнять, я говорю о задаче в первом сообщении ТС, а ты - не понятно о чем... При чем тут "сохраняться браузерами", у ТС - проблема с сохранением браузерами что ли? Мне до лампочки как какой браузер что и как сохраняет. Об отображении браузерами толкуем...
| Цитата (sebastjan) |
| Хочу повторить, я проблеммы не заметил |
Ты проблемы не заметил, потому что ты ее просто не понял и советуешь что то свое. Для того чтобы проблему решить ее как бы надо заметить, не находишь?
Спустя 38 минут, 47 секунд (17.08.2011 - 18:01) sebastjan написал(а):
Про сохранение броузером я говорил имея ввиду что броузер сохраняет у себя в хеш картинку.
А это легко проверить или заглянуть в папку хеша или просто сохранить локально.
Пример хтмл привёл выше.
Почему это я не понял, всё понял, автора волнует почему смена картинки не сразу присходит, а некоторой задержкой.
На мой взгляд, ни какой задержки смены картинки я не увидел.
Есть предположение что адресс картинки написан полностью, вот и броузер обращаеться не локально в свой хеш а опять к серверу.
Но у меня и этой задержки в смене картинки не было.
Жаль автор удалил ссылку на страницу, можно было бы посмотреть, какие пути в адресе картинки.
Хорошо..... тогда обьясни как ты понимаешь суть прооблеммы?
может мы просто о разных вещах говорим?
А это легко проверить или заглянуть в папку хеша или просто сохранить локально.
Пример хтмл привёл выше.
Почему это я не понял, всё понял, автора волнует почему смена картинки не сразу присходит, а некоторой задержкой.
На мой взгляд, ни какой задержки смены картинки я не увидел.
Есть предположение что адресс картинки написан полностью, вот и броузер обращаеться не локально в свой хеш а опять к серверу.
Но у меня и этой задержки в смене картинки не было.
Жаль автор удалил ссылку на страницу, можно было бы посмотреть, какие пути в адресе картинки.
Хорошо..... тогда обьясни как ты понимаешь суть прооблеммы?
может мы просто о разных вещах говорим?
Спустя 37 минут, 29 секунд (17.08.2011 - 18:39) sebastjan написал(а):
Ну так оно и есть , то что я подозревал , в стиле стоит полный путь откуда броузеру картинку брать.
background-image: url("http://listhotel.ru/images/admin_1.png");
Вот броузер и перегружает страницу с повторным обращением к серверу.
Что на медленном подключении к инету может давать эфект задержки.
Моё мнение.
background-image: url("http://listhotel.ru/images/admin_1.png");
Вот броузер и перегружает страницу с повторным обращением к серверу.
Что на медленном подключении к инету может давать эфект задержки.
Моё мнение.
Спустя 6 часов, 52 минуты, 29 секунд (18.08.2011 - 01:31) kirik написал(а):
| Цитата (Michael @ 17.08.2011 - 00:16) |
| Спрайты - это другой путь решения для подобного функционала, но не решение текущей проблемы в топике. |
Если я правильно понял, спрайты и есть решение. При их использовании при смене картинки не будет тормозов (собственно что и волнует ТС).
| Цитата (Xes @ 17.08.2011 - 02:45) |
| Спрайты тоже не пойдут див не жесткий. |
Почему нет? Ты ведь можешь позиционировать картинки в спрайте как нужно, чтобы показывались только нужные.
| Цитата (sebastjan @ 17.08.2011 - 11:01) |
| Есть предположение что адресс картинки написан полностью, вот и броузер обращаеться не локально в свой хеш а опять к серверу. Но у меня и этой задержки в смене картинки не было. Жаль автор удалил ссылку на страницу, можно было бы посмотреть, какие пути в адресе картинки. |
Это ерунда. Во-первых при первом запросе браузер в любом случае будет подгружать картинку из сети. Во-вторых не имеет значения какой путь указан. Если сервер "разрешил" браузеру закэшировать картинку, то последующие разы она будет браться из кэша.
Спустя 9 дней, 16 часов, 48 минут, 58 секунд (27.08.2011 - 18:20) Xes написал(а):
| Цитата |
| display:none если сделать - как раз таки картинки не подгрузятся. тогда уж visibility:hidden надо. |
Дошли у самого руки до заданного мною вопроса. Шас я вас рассужу.
Вот страница на которой меняются фотки 200кб очень хороше все видно. Используем div с дисплей:ноне. Все работает отлично.
!Подождите только пока страница загрузится полностью т.к. фотки большие обе получается полметра.
http://listhotel.ru/t1.html
Страница примерно следующего содержания:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
</head>
<body>
<div><img src="foto/00027/1.jpg" OnMouseOver="this.src='foto/00020/1.jpg'"> </div>
<div style="display:none;"><img src="foto/00020/1.jpg"></div>
</body>
</html>
Спустя 4 дня, 19 часов, 53 минуты, 2 секунды (1.09.2011 - 14:13) Xes написал(а):
Вопрос вероятно останится без ответа. Но всеже хочу поделиться интересным багом.
Небольшие кнопочки рядом со списком Администратору, вторая (подменяемая) картинка это gif где ставится галочка. Для gif задано воспроизвести 1 раз сечас на сайте старый вариант. Фаерфокс при первом наведении отрисовывает галочку два раза, Опера сразу делает все как надо.
Сечас добавил gif в скрытый блок, чтобы обеспечить предзагрузку, Фаерфокс вообще перестал воспроизводить гиф показывает последний результат. Опера попрежнему показывает все ок.
Вероятно тут ни чего не поделаешь, особенности браузера?
Небольшие кнопочки рядом со списком Администратору, вторая (подменяемая) картинка это gif где ставится галочка. Для gif задано воспроизвести 1 раз сечас на сайте старый вариант. Фаерфокс при первом наведении отрисовывает галочку два раза, Опера сразу делает все как надо.
Сечас добавил gif в скрытый блок, чтобы обеспечить предзагрузку, Фаерфокс вообще перестал воспроизводить гиф показывает последний результат. Опера попрежнему показывает все ок.
Вероятно тут ни чего не поделаешь, особенности браузера?
Спустя 3 часа, 1 минута, 38 секунд (1.09.2011 - 17:15) sebastjan написал(а):
не знаю, не вижу бага.
У меня и на фарефокс и на опере всё гут.
Птички отрисовывются нормально.
В ИЕ6 - да два раза отрисовывются.
ПНГ иконок -да, криво в ИЕ6, можно фильтр применить чтоб нормально было и в ИЕ6.
А проще вообщн сделать в жпг картинку и смену по картинки по событию.
Я лично не вижу особого удовольствия когда картинка птички отрисовываеться, как то переносится фокус внемания с саго текста на птичку.
Как по мне, простота залог успеха.
У меня и на фарефокс и на опере всё гут.
Птички отрисовывются нормально.
В ИЕ6 - да два раза отрисовывются.
ПНГ иконок -да, криво в ИЕ6, можно фильтр применить чтоб нормально было и в ИЕ6.
А проще вообщн сделать в жпг картинку и смену по картинки по событию.
Я лично не вижу особого удовольствия когда картинка птички отрисовываеться, как то переносится фокус внемания с саго текста на птичку.
Как по мне, простота залог успеха.
Спустя 6 дней, 15 часов, 21 минута, 13 секунд (8.09.2011 - 08:36) sadon написал(а):
используйте спрайты (посмотрите как устроены миниатюры на Яндексе).