jQuery :: когда я использую fadeIn (), моя страница перемещается в фокус! - PullRequest
2 голосов
/ 16 июля 2010

У меня есть простая HTML-страница, и некоторые javascript используют базовый метод $ (# element) .fadeOut из jQuery для события mouseover.Я также использую метод $ (# element) .hide ().

Но фокус моей страницы смещается вверх!Значение: если я прокручиваю немного вниз и наведя указатель мыши на элемент (который переключает скрипт), сценарий выполняется хорошо, но мой скроллер сразу поднимается, и я теряю то, к чему прокручивался.

Как мне исправитьэтот?

Вот мой код:

function swapElements(unfadeElement, how, callbackExecute)
{
    if (unfadeElement==swapper.active)
    return;

    if (how!="slow" && how!="fast")
    return;

    var fadeElement=swapper.active;

    $("#" + fadeElement).hide();
    $("#" + unfadeElement).fadeIn(how,callbackExecute);
    swapper.active=unfadeElement;
}

Функция fadeIn:

function fadeInElement(element, how, callbackExecute)
{
    //pre: how is "slow" or "fast"
    if (how!="slow" && how!="fast")
    return;
    $("#"+element).fadeIn(how, callbackExecute);
}

Пример вызова сценария:

<a href="javascript: void(0)" onmouseover="fadeIn('carpets','slow',void(0))"> Carpets</a>

EDIT: добавлены некоторыеHTML-кода

  <div id="menuDiv">
....................
                        <div id="menu1" class="menuDivLink">
                        <a href="javascript: void(0)" onmouseover="swapper.fadeIn('carpets','slow',void(0))"> Carpets</a>
                        </div>
                        <div id="menu2" class="menuDivLink">
                        <a href="javascript: void(0)" onmouseover="swapper.fadeIn('rugs','slow',void(0))">Rugs</a>
                        </div>
                        <div id="menu3" class="menuDivLink">
                        <a href="#" onmouseover="swapper.fadeIn('windows','slow',void(0))">Link1</a>
                        </div>
............
</div>

Кроме того, некоторые из моих CSS могут вызвать эту проблему?Заранее спасибо

Ответы [ 2 ]

0 голосов
/ 21 декабря 2010

Попробуйте использовать .animate () вместо fadeIn, что-то вроде

.animate ({непрозрачность: 1}, 300, callBackFunction);

0 голосов
/ 16 июля 2010

Я попробовал то, что у вас было ... (минус изменения fadeInElement вместо fadeIn), и это работает для меня.В IE7 и FF3.5 + он остается в том же месте, что и ранее прокручиваемый до ... Я просто добавил теги br для имитации пробела, и страница не прокручивалась при наведении курсора мыши.Может быть, вы можете опубликовать больше своего HTML, чтобы увидеть, может ли быть что-то еще проблема?

<a href="javascript: void(0)" onmouseover="fadeInElement('carpets','slow',void(0))"> Carpets</a>
...