VPF::Opera не обновляет картину - Форум программистов

svoloch

Дата 8.12.2008, 16:41 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 42
Регистрация: 8.5.2008

Репутация: нет
Всего: нет

решил я приминивнейше поменять src у картинки при наводе на изображение. НО! Опера не хочет этого делаеть. Точнее она делает это криво, а именно: картинка с которой производяться манипуляции вылазит за родительский элемент (что категорически необходимо в данной случае) и она (опера) производит манипуляции только с той частью картинки, которая находиться в родительской элементе. крайне примечательно также что свернув, развернув окно этого... браузера картинка оказываеться в том виде, который должен быть после произведенных манипуляций. в остальных браузера все конечно нормально.
что делать??

IDVsbruck

Дата 8.12.2008, 18:07 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 778
Регистрация: 12.11.2006

Репутация: 8
Всего: 22

выкладывать код

svoloch

Дата 9.12.2008, 13:02 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 42
Регистрация: 8.5.2008

Репутация: нет
Всего: нет

код так код..
кусок верстки:

Код


<span>
       <img id="rec_agent_p" src="img/sun_light_p.gif" alt="" usemap="#map_sun" />
    <img id="rec_agent_a" src="img/sun_light_a.gif" alt="" usemap="#map_sun" />
    <a href="#Контакты  " title="">
           <div id="mmnu_right_div"><img src="img/mmnu_right_p.png" alt="" /></div>Контакты
    </a>
    <img class="mmnu_right" src="img/mmnu_shadow_right.gif" alt="" />
</span>
<map name="map_sun">
    <area href="#" shape="poly" alt=""
onMouseOver="sun_light('rec_agent_p','rec_agent_a');"
onMouseOut="sun_light('rec_agent_a','rec_agent_p');" 
coords="19,87,30,82,31,94,42,85,48,95,54,86,63,95,65,82,77,
87,76,76,88,77,82,65,95,63,87,54,96,48,87,42,
95,32,84,30,89,18,76,20,77,7,67,12,64,1,55,9,49,0,46,0,42,8,
33,0,31,12,19,7,20,19,8,17,13,29,1,31,9,40,0,46,
0,48,9,54,0,64,13,65,7,76,20,75" />
</map>

кусок сss для него:

Код


span {
    display: inline-block;
        position: relative;
    height: 100%;
    margin-left: -4px;
    padding-left: 4px;
    padding-top: 3px;
}

 a {
    display: inline-block;
    position: relative;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: -4px;
    padding-top: 6px;
    height: 29px;
}
img {
    position: absolute;
}
#rec_agent_p, #rec_agent_a {
    float: right;
    margin-top: -68px;
    margin-left: 23px;
}

#rec_agent_a {
    display: none;
}

ну и javascript

Код


function sun_light(off,on){
    document.getElementById(off).style.display = "none";
    document.getElementById(on).style.display = "block";
}

суть в том что замена картинки посредсвом смены свойства display происходит только в пределах span в который оно входит. глюк только в опере. в принципе это уже второй вариант реализации. изначально просто менялся src у картинки эффект был тот-же.

Это сообщение отредактировал(а) Aliance - 11.12.2008, 12:52

Elfebet

Дата 10.12.2008, 18:42 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 545
Регистрация: 15.5.2006
Где: Украина. Запорожь е.

Репутация: нет
Всего: 14

Цитата

изначально просто менялся src у картинки эффект был тот-же.

попробуй такой вариант

Код


<a href="#" onclick="loadImage('image1.png');">картинка 1</a><br>
<a href="#" onclick="loadImage('image2.png');">картинка 2</a><br>
<a href="#" onclick="loadImage('image3.png');">картинка 3</a><br>

<img src="image1.png" align="center" id="image_dynamic">

Код


function loadImage(image)
{
    var el = document.getElementById('image_dynamic');
    el.realSrc = image;
    el.src = el.realSrc + '?r=' + Math.random();
    return false;
}

проверил, во всех браузерах работает

--------------------

Программист не должен всё знать... он должен знать где можно посмотреть

svoloch

Дата 13.12.2008, 09:56 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 42
Регистрация: 8.5.2008

Репутация: нет
Всего: нет

попробовал. эффект точно такой-же. в опере только в пределах родительского контейнера. у остальных нормально. возможно я еще что-то не так сделал. ибо не ведаю что за свойство realSrc у картинки. не мог-ли бы вы пояснить.
и еще раз на всякий случай. суть в том что картинка лежит в <span> у которого прописан inline-block и высота по родительскому (height: 100%;) за которую картинка и вылезает (так надо). меняется только часть картинки (!!!). та что геометрически в пределах родительского <span> причем не важно обновление src или смена display. в ходе экспериментов оказалось что обновить картинку позволяет также операция свернуть-развернуть окно оперы. это глюк 100%, но объяснять это заказчику не хочется.

да и пока суть да дело. страница где глюк оказалось в интернете. так что можно узреть усе сказанное и не читать этих долгих объяснений smile

http://znak.divandesign.ru/ при наведении на оранжевый круг в котором написано "рекламным агентствам!" круг должен становиться немного больше.

fidres

Дата 16.12.2008, 04:43 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 159
Регистрация: 15.11.2006

Репутация: нет
Всего: 1

фиг знает. у меня становится чуть больше... правда у меня опера 9.х... smile

может этот глюк возрастной? ;)
обнови версию.
smile

--------------------

Исправьте ошибку в слове <ХЕРОШО> и я скажу Вам оптимист Вы или пессимист.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »