ここに例があります
リンクの上にマウスを置くと、ウィンドウがポップアップします..(テキストが読み込まれます)
問題は、要素(リンク)の位置に基づいてウィンドウのサイズを変更/再配置できるはずですが、可能かどうか?
現在、要素に基づいてホバーウィンドウを配置しています.要素が(幅/ 2)より大きい場合、ホバーが左側に表示されない場合、ホバーは左側に表示されます..
上下に基づいてホバーウィンドウを配置する方法は?
$("a").hover(
function () {
var a1="";
var a1=$(this).get()
var a1="";
var a1=$(this).get()
var width1= $(window).width();
var width2= width1/2;
alert(width2);
var p = $(this);
var position = p.position();
var left=position.left;
if (left<width2)
{
$(this).append($("<div id='a1' style='clear:both;float:left;font-weight:normal;font-size:12px;display:inline-block;line-height:1.25em;position:relative;left:0px;font-family:Arial;text-decoration:none;font-size:12px;margin-top:10px;width:800px;height:375px;overflow:scroll;padding:10px;z:100000px;margin-left:2px;font-family:Arial;color:#000000;background:#FFFFFF;border: 1px solid #8C8C8C;-moz-box-shadow:5px 5px 5px #888;-webkit-box-shadow:5px 5px 5px #888;box-shadow:5px 5px 5px #888;'>"+"Loading"+"</div>"));
}
else
{
$(this).append($("<div id='a1' style='clear:both;float:left;font-weight:normal;font-size:12px;display:inline-block;line-height:1.25em;position:relative;left:0px;font-family:Arial;text-decoration:none;font-size:12px;margin-top:10px;width:800px;height:375px;overflow:scroll;padding:10px;z:100000px;margin-left:2px;font-family:Arial;color:#000000;background:#FFFFFF;border: 1px solid #8C8C8C;-moz-box-shadow:5px 5px 5px #888;-webkit-box-shadow:5px 5px 5px #888;box-shadow:5px 5px 5px #888;'>"+"Loading"+"</div>"));
}
});