ええと、これが私の初めての質問です - 残念ながら初心者ですが、私の考えを説明したら、誰かが私のスキルを伸ばしてこのレイアウトを整理するのを手伝ってくれることを願っています?
- 私はブートストラップを使用しています
- 1ページに、アイソトープで完全に機能する一連のdivがあります（+無限スクロール）
- ユーザーが各 div にカーソルを合わせると、要素に関する詳細情報をポップオーバーに表示したい
- これを使って仕事に取り掛かることができます
data-container="body"
ここまでは順調ですね..
次に、次を使用して各要素の正しい配置を見つけました。
$('#container').isotope({
itemSelector: '.item',
itemPositionDataEnabled: true
})
// log position of each item
.find('.item').each(function(){
var item_position = $(this).data('isotope-item-position');
console.log('item position is x: ' + item_position.x + ',
y: ' + item_position.y);});
( http://isotope.metafizzy.co/docs/options.html#itempositiondataenabledから)
だから今私が直面している問題は、アイソトープログが私に与えている値に依存するポップオーバーの配置に影響を与える方法です.左または下（見えないように隠れていません）。
これに関するヘルプとガイダンスに感謝します-ここで見つけた答えをほとんど試しましたが、それらを機能させることができません..
（私がここで達成しようとしていることを説明するために、簡単な（そして何らかの理由で同位体が機能していない）フィドルをまとめました：http://jsfiddle.net/watcher/Kv8Bw/1/）
次の試みは @Bass ヘルプを投稿します。
@bass-助けに感謝します-しかし、私のjsの知識がここで私を失望させていると思います(別の回答からのいくつかのロジックが含まれています-[リンク]ウィンドウエッジに対するポップオーバーのX位置に基づいてブートストラップポップオーバーの位置を変更しますか? )これでプラグイン：
$("#popover").popover({
trigger: "hover focus"
});
var tmp = $.fn.popover.Constructor.prototype.show;
$.fn.popover.Constructor.prototype.show = function () {
var items = Array('top','bottom','left','right');
var position = $(this).data('isotope-item-position');
if (position.left > 515) {
return "left";
}
if (position.left < 515) {
return "right";
}
if (position.top < 110){
return "bottom";
}
return "top";
}
tmp.call(this);
しかし、私の問題は（同位体は、私がホバリングしているアイテムではなく、すべてのアイテムの値を返していると思います-何か提案はありますか？）