0

私のリンクがこの特定のページにリダイレクトされない理由を教えてもらえますか? これは私のコードです。jQueryメニューを使用しました：

<link type="text/css" rel="stylesheet" media="all" href="css/styles.css" />
<script src="js/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="js/lavalamp.js" type="text/javascript"></script>
<script>

$(document).ready(function () {
var dleft = $('.lavalamp li.active').offset().left - $('.lavalamp').offset().left; 
var dwidth = $('.lavalamp li.active').width() + "px";

//apply the current position of active item to our floatr element
$('.floatr').css({
    "left": dleft+"px",
    "width": dwidth
});

$('.lavalamp li').hover(function(){

    var left = $(this).offset().left - ($(this).parents('.lavalamp').offset().left + 15);
    var width = $(this).width() + "px";
    var sictranslate = "translate("+left+"px, 0px)";

    $(this).parent('ul').next('div.floatr').css({
        "width": width,
        "-webkit-transform": sictranslate,
        "-moz-transform": sictranslate
    });

},

function(){

    var left = $(this).siblings('li.active').offset().left - ($(this).parents('.lavalamp').offset().left + 15);
    var width = $(this).siblings('li.active').width() + "px";

    var sictranslate = "translate("+left+"px, 0px)";

    $(this).parent('ul').next('div.floatr').css({
        "width": width,
        "-webkit-transform": sictranslate,
        "-moz-transform": sictranslate

    });

}).click(function(){

    $(this).siblings('li').removeClass('active');

    $(this).addClass('active');

    return false;

});

});
</script>

 <p><div class="lavalamp magenta">
<ul >
    <li class="active">
    <a href="http://localhost:52731/MCR/HomeUser.aspx">Home</a></li>
    <li><a href="">Inventory</a></li>
    <li><a href="">My Reservation</a></li>
    <li><a href="">My Profile</a></li>
    <li><a href="">Contact Us</a></li>
    <li><a href="">Log Out</a></li>

</ul>
    <div class="floatr"></div>
</div></p>

[ホーム] をクリックしても、ページは何もしませんでした。私は何をすべきか教えてください。P/s : ハイパーリンクに置き換えられましたが、それでも同じです。

4

1 に答える 1

0

JQuery メニュー プラグインは、メニューを構成する未加工の HTML で何かをしていると思っていたでしょう。これを確認するために要素を調べてみてください。

  • 使用している JQuery プラグインは何ですか?
  • ページが読み込まれた後に HTML を提供できますか?

それから私はさらに助けることができます..

SR

編集：

メニュー項目自体に HREF URL を配置するのではなく、単純な href="#" を使用して、メニュー項目に id 値を指定する必要があると思います。

次に、次を使用して、要素のクラスまたは ID のいずれかのクリック イベントにバインドします。

$(".classname,#idofelement").click( function() {
    // do your stuff
});

lavalamp のチュートリアルについては、次のページを参照してください。

http://www.queness.com/post/530/simple-lava-lamp-menu-tutorial-with-jquery

また、クリック ハンドラーでこれを使用してリダイレクトすることもできます。

window.location.replace("http://stackoverflow.com");

次のようなものを使用して、クリック ハンドラーでクリックされた要素のクラスまたは ID を見つけることができます。

if($(this).attr("id") == "myelement") {
    // redirect here using window.location
} else {
    // etc
}

お役に立てれば！

于 2012-09-10T16:20:26.933 に答える