0

jqueryといくつかのcssを使用して、マウスホバーで表示されるポップアップを作成しようとしています。コードは正常に機能しますが、何らかの理由でポップアップ ウィンドウの子要素に CSS を追加できません。

jqueryコードは次のとおりです。

  $(document).ready(function(){

    var $popup = $('.popup');
    $('area').on({
      mouseover : function(e){
        var $this = $(this),
            $obj = $('#'+$this.prop('alt'));
        $popup.text($obj.text()).css({
          top: '90%',
          left: '24.8%',
          color: 'orange',
          }).show();
      },
      mouseout: function(){
        var $this = $(this),
            $obj = $('#'+$this.prop('alt'));          
        $popup.hide(0).empty();
      }
    });
    });

そして、ポップアップに表示される内容を含むポップアップ HTML コードを次に示します。ポップアップ内に表示されるクラスに css を追加しようとしても何も起こりません。

<div class="stanovanje" id="n1s1">
<h2>Področje 1</h2>
  <div class="koda">Koda:<br><p>1-12-123-S1</p></div><div class="tip">Tip:<br><p>A1</p></div><div class="povrsina">Površina:<br>84.24m</div> <div class="vrsta">Vrsta:<br>z balkonom/teraso</div><div class="cena">Cena:<br>120000€&lt;/div>
</div>
<div class="stanovanje" id="n1s2">
  <div class="koda">Koda:<br><p>1-12-123-S2</p></div><div class="tip">Tip:<br><p>A2</p></div><div class="povrsina">Površina:<br>74.24m</div> <div class="vrsta">Vrsta:<br>z balkonom/teraso</div><div class="cena">Cena:<br>140000€&lt;/div>
</div>
<div class="popup"></div>

読んでくれてありがとう！

4

2 に答える 2

1

上または左の小道具は、配置された elem で機能します Update 2: このように機能することを願っています

JS

var $popup = $('.popup');   
$popup.html($obj.html());
$('.popup div').css({
    top: '90%',
    left: '24.8%',
    color: 'orange',
position: 'relative' //absolute
});
$popup.show();
于 2013-11-11T09:48:47.797 に答える
0

コードも間違っています。最後のコンマを削除する必要があります。

$popup.text($obj.text()).css({
    top: '90%',
    left: '24.8%',
    color: 'orange',
}).show();

次のようにする必要があります。

$popup.text($obj.text()).css({
    top: '90%',
    left: '24.8%',
    color: 'orange'
}).show();
于 2013-11-11T09:24:47.793 に答える