Javascript-форум (https://javascript.ru/forum/)
-   Opera, Safari и др. (https://javascript.ru/forum/css-html-browser/)
-   -   Невыполнение скрипта для уже загруженных картинок в опере (https://javascript.ru/forum/css-html-browser/30113-nevypolnenie-skripta-dlya-uzhe-zagruzhennykh-kartinok-v-opere.html)

Acreator57887 25.07.2012 23:43

демо-картинки. уменьшает и выравнивает

Deff 26.07.2012 00:01

Acreator57887,
Там в скрипте имхо смысла нет http://s1.uploads.ru/i/8E4sm.png

Cкриншот с отключенным ява скрипт и вставкой такого сss кода:
<style type="text/css">
td.phtTdMain img.demophoto{
  width: 288px!important;
  height: 180px!important;
}
</style>

Acreator57887 26.07.2012 12:06

:blink: Почему такое качество? А ясно, это качество скриншота.
Ну да, в этом и проблема, что в Опере после обновления страницы скрипт не выполняется. Незнаю как у Вас, но у меня если почистить кэш при первой загрузке так:
http://s2.hostingkartinok.com/upload...f2a97d96e2.png

У меня изначально в CSS выставленны минимальные и максимальные значения высоты и ширины изображений, так что скрипт только немного "доуменьшает" и позиционирует.

P.S. На странице возможны какие-либо изменения, т.к. я сам тоже пытаюсь) пробую разные варианты.

Deff 26.07.2012 12:30

Acreator57887,
Цитата:

Сообщение от Acreator57887
только немного "доуменьшает" и позиционирует.

Смысла в скрипте - нет
1. Изо стоят в див блоке со скрытым скроллом и автоцентрированием по ширине
2. у Изо скриптом выставляется высота 180, что равнозначно
height: 180px!important

Думаю смело можно выкинуть данный скрипт и оставить только css

Acreator57887 26.07.2012 12:43

:lol: Кажется решил проблему :lol:

Может опять "не до конца":lol:

Но по-моему всё работает. Может протестите? У меня сейчас во всех браузерах всё работает, ... пока работает))

Вот общий скриншот в опере:
http://smotr.im/6bLg

Вот результат работы скрипта:
http://smotr.im/6bLy

Вертикально-ориентированная картинка уменьшена: ширина соответствует 180 px, + выравнивание по середине по вертикали.

Acreator57887 26.07.2012 12:48

Deff,

А вот с отключенным javsdcript:
http://smotr.im/6bM4
http://smotr.im/6bMt

По-моему большая разница.
Или вы до сих пор считаете, что скрипт ничего не меняет??

$('.demophoto').each(function() {
var cimg = $(this);
var img = new Image;
img.onload = function() {

// Получаем размеры:
var width = cimg.width(); 
var height = cimg.height();


// Если ширина больше высоты, то высоте присваеваем 180, иначе ширине присваеваем 180

if (width > height) {
cimg.css('height', 180);
} else {
cimg.css('width', 180);
};


// Получаем новые размеры (на всякий пожарный):

var width_new = cimg.width();
var height_new = cimg.height();


// И позиционируем

if (width_new > 180) {
var rig = (width_new-180)/2;
cimg.css('right', rig);
} else {
var bot = (height_new-180)/2;
cimg.css('bottom', bot);
};

}
img.src = this.src;
});


Цитата:

Сообщение от Deff
скриптом выставляется высота 180

С чего вы это взяли? Так происходит только когда ширина больше высоты то есть когда картинка ориентирована горизонтально, если же картинка ориентирована вертикально, то ширине присваевается 180.

Deff 26.07.2012 13:15

Acreator57887,
пропишите onload="Func(this)" в тег каждой картинки - траблов не будет

<script type="text/javascript">
function Func(a) {
 alert(a.src)
}
</script>

<center>

<img src="http://javascript.ru/forum/images/smilies/blink.gif" onload="Func(this)"/><br /><br />
<img src="http://st.ladycash.ru/data/links_block/12997_12862_1.gif" onload="Func(this)"/>

</center>

Acreator57887 26.07.2012 13:19

Спасибо конечно) а что такое траблы?
Объясните нубу)

Deff 26.07.2012 13:23

Acreator57887,
Cкрипта достаточно одного на все картинки и он должен стоять выше их всех

Трабл - тоже, что и баг(Картинки просто загружаются ранее, чем Вы пытаетесь что то делать скриптом

Acreator57887 26.07.2012 13:27

Да, я примерно так и подумал, но не знал что конкретно эти траблы.

С этим я ступил, просто подключать к каждой к картинке, как ни странно это ни звучит, на ucoz намного легче - достаточно прописать скрипт в одном из шаблонов.

А выше вставлять, это куда? Без разницы или в head?


Часовой пояс GMT +3, время: 19:54.