source: extensions/LLGBO2/js/jquery_llgbotip.js @ 16145

Last change on this file since 16145 was 16145, checked in by gbo, 12 years ago

Fix: Tooltip not displayed according the option

File size: 2.4 KB
Line 
1jQuery(document).ready(function(jQuery){ 
2/* CONFIG */           
3// these 2 variables determine popup's gap from the cursor             
4var     xGap = 10;
5var     yGap = 10;
6var     MainTitle ="";
7       
8var     maxTop = 0;
9var     maxLeft =0;   
10/* END CONFIG */       
11jQuery("#theMainImage").mouseover(function(){
12//  tooltip IMG title remove     
13        MainTitle = this.title;
14        this.title =""; 
15        });     
16jQuery("#theMainImage").mouseout(function(){
17//   tooltip IMG  title restaure         
18        this.title = MainTitle; 
19        });     
20               
21jQuery("area,a").mouseover(function(e){ 
22        MainTitle = jQuery("#theMainImage").attr("title");
23        jQuery("#theMainImage").attr("title",""); // for IE
24        this.t = this.title;
25 // llgbo conf
26        var val = this.title.split("||",15);
27        if (val[0].length<1) { return; }
28        maxLeft =  jQuery(window).width();
29        maxTop =  jQuery(window).height();
30                //
31        this.activate ='ok';
32        this.title = "";
33        this.tt = "<p id='title'>"+val[0]+"</p>";
34        var pid = "dflt";
35        if (this.className != "navThumb") // no picture for navthumb
36                {for (var i=1; i<val.length; i++) { 
37                if ( val[i].toLowerCase().indexOf("<img") == 0) 
38                        { pid = "pict";}
39                        this.tt += "<p id="+pid+">"+ val[i]+"</p>";}
40                        }               
41        jQuery("body").append("<div id='toolTip'>"+this.tt+"</div>"); 
42
43        var MyTT = jQuery("#toolTip");
44        if (this.id == "Rules")
45                        { MyTT.css( {'border-color':'#c92'});}
46        if (this.id == "RulesEx")
47                { MyTT.css( {'border-color':'#d3fed2'})
48                jQuery("#toolTip #title").css({'color':'#d3fed2'});}
49
50        updateXY(e);
51         MyTT.css("opacity", 0.25)
52                .show; 
53         MyTT.fadeTo(1200,.95);
54});                     
55
56jQuery("area,a").mouseout(function(e){ 
57        if (this.activate =='ok') // mouseout without mouseover we keep the right title
58        { this.title = this.t;   
59        jQuery("#toolTip")
60        .fadeOut("slow")
61        .remove();
62         jQuery("#theMainImage").attr("title",MainTitle); // for IE
63         }
64 });   
65jQuery("area,a").mousemove(function(e){
66        updateXY(e);
67});     
68var updateXY = function(e) {
69        var xLeft,yCord,xCord;
70        var MyTT = jQuery("#toolTip");
71        var wT = MyTT.width() + 6 /* border */+ xGap;
72        var hT = MyTT.height() + 6 /* border */+ yGap; 
73       
74        if ( e.pageX < (maxLeft/2) )  // piwigo left
75                {xCord = wT *-1;}
76                else {
77         xCord =( maxLeft < (e.pageX + wT )) ?  xCord = wT * -1 : xCord = xGap;}       
78         xLeft = (e.pageX + xCord < 3 ) ? xLeft = e.pageX + xGap : xLeft = e.pageX + xCord;
79         yCord =( maxTop < (e.pageY + hT )) ?   yCord = hT * -1 : yCord = yGap;
80        MyTT
81                .css("top",(e.pageY + yCord) + "px")
82                .css("left",(xLeft) + "px");
83        }
84});
Note: See TracBrowser for help on using the repository browser.