Hover Event с использованием JQuery - PullRequest
Новая
       0

Hover Event с использованием JQuery

0 голосов
/ 11 июня 2010

Я пытаюсь заставить маркер двигаться, когда пользователь наводит курсор на определенный код, вот мой: 


$(document).ready(function(){
        $("#icondesc a").hover(function(){
            var cls = $(this).attr("class");
            $(this).siblings("p").hide();
            $(this).siblings("p."+ cls + "_qu").show();
            if(cls == "talk1"){
                marginleft = "415px";
            } else if (cls == "talk2"){
                marginleft = "535px";
            } else if (cls == "talk3"){
                marginleft = "655px";
            } else if (cls == "talk4"){
                marginleft = "777px";
            } else if (cls == "talk5"){
                marginleft = "893px";
            }

            $("#quote_marker").animate({"margin-left": marginleft});
        });
});

и вот как выглядит мой icondescription div 

`
<div id="icondesc">

                    <a class="talk5" href="services/solutions/index.php#energyanchor">
                    <img src="img/homeblue.png" alt="homeicon" class="icons">
                    </a><a class="talk4" href="services/solutions/index.php#fleetanchor">
                    <img src="img/truckblue.png" alt="fleeticon" class="icons">
                    </a><a class="talk3" href="services/solutions/index.php#medicalanchor">
                    <img src="img/medicalblue.png" alt="medicon" class="icons">
                    </a><a class="talk2" href="services/solutions/index.php#deviceanchor">
                    <img src="img/radioblue.png" class="icons" alt="radioicon">
                    </a><a class="talk1" href="services/solutions/index.php#transanchor">
                    <img src="img/busblue.png" class="icons" alt="transicon">
                    </a>

<p class="talk1_qu">Transportation</p>
<p class="talk2_qu" style="display:none;">Devices</p>
<p class="talk3_qu" style="display:none;">Medical</p>
<p class="talk4_qu" style="display:none;">Fleet Management</p>
<p class="talk5_qu" style="display:none;">Energy</p>

<span id="quote_marker"></span>
</div>
`

Итак, у quote_marker просто есть background-image, а поле margin-left определяется в CSS. Кроме того, Положение установлено на абсолютное значение.

firebug говорит мне, что marginleft не определен. любой совет поможет!

1 Ответ

1 голос
/ 12 июня 2010

После тестирования размещенной страницы кажется, что использование marginLeft вместо 'margin-left' решает проблему.

Вы также используете jQuery 1.3.2 вместо 1.4.2. Может быть, это факторы?

В любом случае, я понятия не имею, почему эта форма оставленного поля не работает на вашей странице, когда она работает в jsFiddle, но это, похоже, исправление.

...