0

IDごとに特定の条件を書かずに、 hoverIntentを使ってコンテンツを公開しようとしています。id + '-x' に文字を追加して選択したコンテンツを表示できるように、設定で id をマウスに渡したいと思います。

ホバリングしている div を取得する方法をいくつか試しましたが、これらは通常、クラス「ボックス」を持つすべての div のすべての情報を返すことになります。

私がしなければならない親、子のことはありますか?よくわかりませんが、こういう場面で役に立ちそうな気がします。

<div id="id-first-div" class="box">Trigger 1</div>
<div id="id-second-div" class="box">Trigger 2</div>

<div id="id-second-div-x" class="hide">Hidden Bullet 1</div>
<div id="id-first-div-x" class="hide">Hidden Bullet 2</div>

<script>
$(document).ready(function() {
    $("#id-first-div").hoverIntent(slide_right_settings);
    $("#id-second-div").hoverIntent(slide_right_settings);
});

var slide_right_settings={
    sensitivity: 4,
    interval: 1500,
    timeout: 5000,
    over: mousein_triger,
    out: mouseout_triger
};  

function mousein_triger(){
    var id = this.id; // I'm pretty sure I'm going wrong here 
    $(id + '-x').addClass('reveal');
    $(id + '-x').removeClass('hide');
}

function mouseout_triger() {
    $(id +'-x').addClass('hide');
    $(id +'-x').removeClass('reveal');
    }
</script>
4

2 に答える 2

0
//hover intent opening and closing
var slide_right_settings={
    over: mousein_triger,
    out: mouseout_triger
};  

//default id is home
var id = "home";

function mousein_triger(){
//updates id to the one triggering
    id = $(this).attr('id');
    $('#' + id + '-x').addClass('reveal');
    $('#' + id + '-x').removeClass('hide');
}

function mouseout_triger() {
    $('#' + id +'-x').addClass('hide');
    $('#' + id +'-x').removeClass('reveal');                
}

Still not sure if this is the best way to achieve this, but it's working.. I'm sure it could be improved a lot.

于 2013-03-07T00:14:06.357 に答える
0

var id = this.id;関数の外に置く

于 2013-04-15T12:02:47.190 に答える