Home > Web Front-end > JS Tutorial > jQuery location plugin_jquery

jQuery location plugin_jquery

WBOY
Release: 2016-05-16 18:57:14
Original
1032 people have browsed it

Plug-in code:
/*Floating fixed layer at any position*/
/*No Sword (http://regedit.cnblogs.com) 08-03-11*/
/*Description: You can specify The layer floats to any position on the web page. When the scroll bar scrolls, it will remain at the current position and will not flash */
/*2008-4-1 modification: Invalid when the right position is customized , add a judgment here
If it has a value, it will not be set. If it has no value, it will add 18px. Fixed the problem of layer position under ie6
*/
/* call:
1 No parameter call :Default float in the lower right corner
$("#id").floatdiv();
2 built-in fixed position float
//lower right corner
$("#id").floatdiv(" rightbottom");
//Lower left corner
$("#id").floatdiv("leftbottom");
//Lower right corner
$("#id").floatdiv(" rightbottom");
//Upper left corner
$("#id").floatdiv("lefttop");
//Upper right corner
$("#id").floatdiv(" righttop");
//Centered
$("#id").floatdiv("middle");
3 Custom position floating
$("#id").floatdiv({ left:"10px",top:"10px"});
With the above parameters, set the floating layer at 10 pixels from the left and 10 pixels from the top
*/
jQuery.fn.floatdiv=function (location){
//ie6 wants to hide the vertical scroll bar
var isIE6=false;
if($.browser.msie && $.browser.version=="6.0"){
$ ("html").css("overflow-x","auto").css("overflow-y","hidden");
isIE6=true;
};
$(" body").css({margin:"0px",padding:"0 10px 0 10px",
border:"0px",
height:"100%",
overflow:"auto"
});
return this.each(function(){
var loc;//The absolute positioning position of the layer
if(location==undefined || location.constructor == String){
switch(location){
case("rightbottom")://lower right corner
loc={right:"0px",bottom:"0px"};
break;
case( "leftbottom")://lower left corner
loc={left:"0px",bottom:"0px"};
break;
case("lefttop")://upper left corner
loc={left:"0px",top:"0px"};
break;
case("righttop")://upper right corner
loc={right:"0px",top:" 0px"};
break;
case("middle")://center
var l=0;//left
var t=0;//top
var windowWidth ,windowHeight;//The height and width of the window
//Get the height and width of the window
if (self.innerHeight) {
windowWidth=self.innerWidth;
windowHeight=self.innerHeight;
}else if (document.documentElement&&document.documentElement.clientHeight) {
windowWidth=document.documentElement.clientWidth;
windowHeight=document.documentElement.clientHeight;
} else if (document.body) {
windowWidth=document.body.clientWidth;
windowHeight=document.body.clientHeight;
}
l=windowWidth/2-$(this).width()/2;
t= windowHeight/2-$(this).height()/2;
loc={left:l "px",top:t "px"};
break;
default://default is Lower right corner
loc={right:"0px",bottom:"0px"};
break;
}
}else{
loc=location;
}
$(this).css("z-index","9999").css(loc).css("position","fixed");
if(isIE6){
if(loc.right !=undefined){
//2008-4-1 modification: It is invalid when customizing the right position. Add a judgment here
//If there is a value, it will not be set. If there is no value, 18px will be added. Corrected Layer position
if($(this).css("right")==null || $(this).css("right")==""){
$(this).css( "right","18px");
}
}
$(this).css("position","absolute");
}
});
} ;
Usage:



Anywhere floating window plug-in






Upper right corner

Lower left corner





/*Floating fixed layer at any position*/

/*Description: You can make the specified layer float to any position on the web page, and it will remain at the current position when the scroll bar scrolls. Change, no flashing */

/*Call:

1 Call without parameters: float in the lower right corner by default

$("#id").floatdiv ();



2 Built-in fixed position float

//Lower right corner

$("#id").floatdiv("rightbottom") ;

//Lower left corner

$("#id").floatdiv("leftbottom");

//Lower right corner

$( "#id").floatdiv("rightbottom");

//Upper left corner

$("#id").floatdiv("lefttop");

//Upper right corner

$("#id").floatdiv("righttop");

//Centered

$("#id").floatdiv( "middle");



3 Custom position float

$("#id").floatdiv({left:"10px",top:"10px" });

With the above parameters, set the floating layer at 10 pixels from the left and 10 pixels from the top
*/
hello



































































hello


Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template