Как изменить размер окна наведения на основе размера родительского окна - PullRequest
Новая
       33

Как изменить размер окна наведения на основе размера родительского окна

0 голосов
/ 25 ноября 2011

Вот пример

http://textonly.in/test3.php

При наведении курсора мыши на любую ссылку появляется всплывающее окно .. (загружается текст)

Проблема в том, что я должен иметь возможность изменить размер / изменить положение окна в зависимости от положения элемента (ссылки). Возможно ли это?

На данный момент я позиционирую окно наведения на основе элемента ... Если элемент больше (ширина / 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>"));
    }
 });
...