2011-02-01 12 views
0

私はQtipでJquery 1.4.4を使用していますが、個々のリスト項目ごとにイメージをロードしようとしていますので、Content:URL:.attr(rel)を使用していますが、 RELQtipはREL URLを読み込みません

<script type="text/javascript"> 
// Create the tooltips only on document load 
$(document).ready(function() { 
$('ul.list-one li a[href]').each(function(){ 
    $(this).qtip({ 
    Content: { url: $(this).attr('rel') }, 
    position: { 
    corner: { 
     target: 'topMiddle', 
     tooltip: 'bottomMiddle' 
       } 
       }, 
    style: { 
     tip: 'bottomMiddle', 
     border: { width: 2, radius: 2, color: '#A9D041' }, 
    background: '#fff', 
    padding:0, 
    width: 175, 
    height:100 
     } 

    }); 
}); 
}); 
</script> 




<ul class="list-one"> 
<li class="header">Project Management</li> 
<li><a href="#">BGC Bremerholm</a></li> 
<li><a href="#">Medtronic</a></li> 
<li><a href="#">Straumur - Burdaras Bank</a></li> 
<li><a href="#">Straumur Reykjavik</a></li> 
<li><a href="#">Straumur Stockholm</a></li> 
<li><a rel="/test/test.html" href="#">T. Rowe Price</a></li> 

</ul> 
+0

test.htmlページを同じディレクトリに移動しようとしましたか?したがって、あなたのrel値は 'test.html'になります。 –

+0

yea、まだ何も得られていない – goetzs

答えて

0

ContentのURLが

content: { url: $(this).attr('rel') }, 
+0

これはうまくいきませんでした。 – goetzs

+0

GOTは、上記のような内容のすべてを、ページのフッターにある最後のタグの直前に配置することを強くお勧めします。これにより、DOMの操作が行われる前にすべてのコンテンツがロードされます。 – goetzs

+0

Chrome WTFでサポートされていない – goetzs

0

ゲッツC小文字である必要があり、document.ready()関数は、それは、あなたがページの下部にそれを置く必要がないことを意味します焼く前にページが読み込まれるのを待ちます。

は、私は最近のプロジェクトのためにこれを使用し、それはあなたが単にそれらのすべての要素とaply Qティップを取得するためにjqueryのから、それぞれを使用することができます:)

$('.test').each(function(){ 
     $(this).qtip({ 
      content: { text: '<img src="' + $(this).attr('href') + '" />' }, 
      show: { delay: 0 }, 
     }); 
     }); 
1

だけで正常に動作します。このように簡単に操作できます。

$('.qtip').each(function(){ 
    $(this).qtip({ 
     content: { url: $(this).attr('rel'), method: 'get' }, 

     style: { 
     padding: '7px 13px', 
     width: { 
      max: 510, 
      min: 0 
     }, 
     tip: true 
     } 
    }); 
    }); 
関連する問題