Home » Source Code » » jkl-floating.js

jkl-floating.js ( File view )

From:
  • By 2010-08-11
  • View(s):5
  • Download(s):0
  • Point(s): 1
			// ================================================================
//  jkl-floating.js ---- JavaScript Kantan Library for Floating Element
//  Copyright 2005 Kawasaki Yusuke <u-suke@kawa.net>
// ================================================================
//  v0.02  2005/06/26  first release
//  v0.03  2005/06/27  moveCenter moveLeft moveRight moveTop moveBottom
// ================================================================

/******************************************************************

    var float1 = new JKL.Floating("messbody","messhead");
    float1.opacity( 1.0, 0.9 );
    float1.moveTo(50,50);
    float1.start();

******************************************************************/

if ( typeof(JKL) == 'undefined' ) JKL = function() {

};

//  constructor 

JKL.Floating = function( bodyid, headid ){

    this.__bodyId = bodyid;       // body area id
    this.__headId = headid || bodyid;
    this.__bodyElem = null;       // body area element
    this.__headElem = null;       // head area element
    this.posX = null;
    this.posY = null;
    this.curX = null;          // previous clientX
    this.curY = null;
    this.opacityDefault  = null;
    this.opacityFloating = null;
    this.onDrag = false;        // draging=true, released=false
    this.saveEvents = [];       // backup event on dragging
    this.setAbsolute = false;
    return this;

};

//  class variables

JKL.Floating.VERSION = "0.03";
JKL.Floating.SAVE_EVENTS = [ 
    "onmousedown", "onmousemove", 
    "onmouseout", "onmouseover", 
    "onmouseup", "onselect"
];

//  methods

JKL.Floating.prototype.opacity = function (opa1,opa2) {

    this.opacityDefault = opa1;
    this.opacityFloating  = opa2;
    this.setOpacity( opa1 );

}

JKL.Floating.prototype.setOpacity = function ( opac ) {

    if ( ! opac ) return;
    var elemF = this.getBodyElement();
    elemF.style.filter = "Alpha(opacity:"+(opac*100)+")";   // IE6
    elemF.style.KhtmlOpacity = opac;        // Safari
    elemF.style.MozOpacity = opac;          // Firefox
    elemF.style.opacity = opac;             // CSS2

}

//  move to edge of window

JKL.Floating.prototype.moveLeft = function ( x ) {

    if ( ! x ) x = 0;
    x += document.body.scrollLeft;
    this.moveTo( x, null );

}
JKL.Floating.prototype.moveRight = function ( x ) {

    if ( ! x ) x = 0;
    var elemF = this.getBodyElement();
    if ( ! elemF ) return;    // no such element
    var x = document.body.scrollLeft + document.body.clientWidth 
            - elemF.offsetWidth - x;
    this.moveTo( x, null );

}
JKL.Floating.prototype.moveTop = function ( y ) {

    if ( ! y ) y = 0;
    y += document.body.scrollTop;
    this.moveTo( null, y );

}
JKL.Floating.prototype.moveBottom = function ( y ) {

    if ( ! y ) y = 0;
    var elemF = this.getBodyElement();
    if ( ! elemF ) return;    // no such element
    var y = document.body.scrollTop + document.body.clientHeight 
            - elemF.offsetHeight - y;
    this.moveTo( null, y );

}

//  move to center of window

JKL.Floating.prototype.moveCenter = function () {

    var elemF = this.getBodyElement();
    if ( ! elemF ) return;    // no such element
    var x = document.body.clientWidth  / 2 - elemF.offsetWidth  / 2;
    var y = document.body.clientHeight / 2 - elemF.offsetHeight / 2;
    this.moveTo( x, y );

}

//  move (relative)

JKL.Floating.prototype.moveBy = function (x,y) {

    var elemF = this.getBodyElement();
    if ( ! elemF ) return;    // no such element
    x += elemF.offsetLeft;
    y += elemF.offsetTop;
    this.moveTo( x, y );

}

//  move (absolute)

JKL.Floating.prototype.moveTo = function (x,y) {

    var elemF = this.getBodyElement();
    if ( ! elemF ) return;    // no such element
    if ( typeof(x) == "number" || x ) {

        this.posX = x;
        elemF.style.left = this.posX+"px";
    
}
    if ( typeof(y) == "number" || y ) {

        this.posY = y;
        elemF.style.top  = this.posY+"px";
    
}
    elemF.style.right = "";
    elemF.style.bottom = "";

}

JKL.Floating.prototype.start = function () {

    var elemH = this.getHeadElement();
    if ( ! elemH ) return;    // no such element
    this.moveBy( 0, 0 );
    var copy = this;
    elemH.onmousedown = function(ev) {
 copy.dragStart(ev); 
};

};

JKL.Floating.prototype.stop = function () {

    var elemH = this.getHeadElement();
    if ( ! elemH ) return;    // no such element
    elemH.onmousedown = null;

};

JKL.Floating.prototype.dragStart = function (ev) {

    if ( document.all && ! ev ) ev = window.event;
    if ( this.onDrag ) return;

    this.moveBy( 0, 0 );
    this.setOpacity( this.opacityFloating );

    this.curX = ev.clientX;                 // current cursor
    this.curY = ev.clientY;
    this.onDrag = true;                     // begin drag mode
    this.backupEvent();                     // backup events and cursor style

    var copy = this;
    document.onmousemove = function(ev){
 copy.dragMoving( ev ); 
};
    document.onmouseup   = function(ev){
 copy.dragReleased( ev ); 
};

};

JKL.Floating.prototype.dragMoving = function (ev) {

    if ( document.all && ! ev ) ev = window.event;
    if ( ! this.onDrag ) return;

    this.posX = this.posX + ev.clientX - this.curX;
    this.posY = this.posY + ev.clientY - this.curY;
    this.curX = ev.clientX;                 // current cursor
    this.curY = ev.clientY;

    var elemF = this.getBodyElement();
    elemF.style.left = this.posX+"px";
    elemF.style.top  = this.posY+"px";

};

JKL.Floating.prototype.dragReleased = function (ev) {

    if ( ! this.onDrag ) return;
    this.setOpacity( this.opacityDefault );
    this.restoreEvent();
    this.onDrag = false;                    // released

};

JKL.Floating.prototype.backupEvent = function () {

    for ( var i=0; i<JKL.Floating.SAVE_EVENTS.length; i++ ) {

        var key = JKL.Floating.SAVE_EVENTS[i];
        this.saveEvents[key] = document[key];
        document[key] = null;
    
}

};

JKL.Floating.prototype.restoreEvent = function () {

    for ( var i=0; i<JKL.Floating.SAVE_EVENTS.length; i++ ) {

        var key = JKL.Floating.SAVE_EVENTS[i];
        document[key] = this.saveEvents[key];
    
}
    this.saveEvents.length = 0;

};

JKL.Floating.prototype.getBodyElement = function () {

    if ( ! this.__bodyElem ) {

        if ( typeof(this.__bodyId) == "object" && this.__bodyId.parentNode ) {

            this.__bodyElem = this.__bodyId;
            this.__bodyId = this.__bodyElem.id;
        
} else {
 
            this.__bodyElem = document.getElementById( this.__bodyId );
        
}
    
}
    if ( ! this.setAbsolute ) {

        this.__bodyElem.style.position = "absolute";    // once
        this.setAbsolute = true;
    
}
    return this.__bodyElem;

};

JKL.Floating.prototype.getHeadElement = function () {

    if ( ! this.__headElem ) {

        if ( typeof(this.__headId) == "object" && this.__headId.parentNode ) {

            this.__headElem = this.__headId;
            this.__headId = this.__headElem.id;
        
} else {
 
            this.__headElem = document.getElementById( this.__headId );
        
}
    
}
    return this.__headElem;

};

// ================================================================
			
...
Expand> <Close

Want complete source code? Download it here

Point(s): 1

Download
0 lines left, continue to read
Sponsored links

File list

Tips: You can preview the content of files by clicking file names^_^
Name Size Date
auto_suggest.html1.09 kB03-12-07 00:11
crud.html1.68 kB03-12-07 00:11
03.00 B
2col_leftNav.css6.28 kB03-12-07 00:11
autosuggest.css335.00 B03-12-07 00:11
debug.png399.00 B03-12-07 00:11
error.png289.00 B03-12-07 00:11
fatal.png309.00 B03-12-07 00:11
info.png271.00 B03-12-07 00:11
logger.css1.88 kB03-12-07 00:11
magnet.png430.00 B03-12-07 00:11
site.css1.43 kB03-12-07 00:11
warn.png257.00 B03-12-07 00:11
03.00 B
auto_suggest.html.txt1.09 kB03-12-07 00:11
auto_suggest.js.txt669.00 B03-12-07 00:11
CountryList.java.txt3.00 kB03-12-07 00:11
crud.html.txt1.68 kB03-12-07 00:11
crud.js.txt1.40 kB03-12-07 00:11
crud.jst.txt755.00 B03-12-07 00:11
index.html.txt3.24 kB03-12-07 00:11
jst_demo.html.txt1.68 kB03-12-07 00:11
LabelValueBean.java.txt4.72 kB03-12-07 00:11
mvcPic.html.txt1.05 kB03-12-07 00:11
rdf.jst.txt284.00 B03-12-07 00:11
rss.jst.txt272.00 B03-12-07 00:11
rss_reader.html.txt1.20 kB03-12-07 00:11
rss_reader.js.txt642.00 B03-12-07 00:11
services.properties.txt168.00 B03-12-07 00:11
services.xml.txt435.00 B03-12-07 00:11
Test.java.txt17.36 kB03-12-07 00:11
TestBean.java.txt1.41 kB03-12-07 00:11
unit_test.html.txt1.03 kB03-12-07 00:11
unit_test.js.txt15.89 kB03-12-07 00:11
unit_test.jst.txt493.00 B03-12-07 00:11
unit_test_js.jst.txt765.00 B03-12-07 00:11
User.java.txt2.49 kB03-12-07 00:11
UserManager.java.txt2.04 kB03-12-07 00:11
web.xml.txt1.58 kB03-12-07 00:11
web.xml_no_spring.txt1.58 kB03-12-07 00:11
03.00 B
check.gif604.00 B03-12-07 00:11
debug.png399.00 B03-12-07 00:11
error.gif633.00 B03-12-07 00:11
error.png289.00 B03-12-07 00:11
fatal.png309.00 B03-12-07 00:11
info.png271.00 B03-12-07 00:11
magnet.png430.00 B03-12-07 00:11
swato_01.png5.22 kB03-12-07 00:11
swato_02.png13.94 kB03-12-07 00:11
swato_04.png7.94 kB03-12-07 00:11
swato_05.png14.42 kB03-12-07 00:11
swato_Layer-5-over.png27.12 kB03-12-07 00:11
swato_Layer_5.png28.45 kB03-12-07 00:11
wait.gif1.52 kB03-12-07 00:11
warn.png257.00 B03-12-07 00:11
index.html3.70 kB03-12-07 00:11
03.00 B
effects.js33.07 kB03-12-07 00:11
jkl-floating.js7.22 kB03-12-07 00:11
jkl-parsexml.js14.11 kB03-12-07 00:11
jkl-resizable.js5.05 kB03-12-07 00:11
json.js10.34 kB03-12-07 00:11
logger.js6.77 kB03-12-07 00:11
pop-it-menu.js4.44 kB03-12-07 00:11
prototype.js55.81 kB03-12-07 00:11
swato-engine.js5.06 kB03-12-07 00:11
swato-form.js3.00 kB03-12-07 00:11
swato-jst.js3.91 kB03-12-07 00:11
swato-select.js1.18 kB03-12-07 00:11
swato-suggest.js11.62 kB03-12-07 00:11
swato.js939.00 B03-12-07 00:11
window.js40.77 kB03-12-07 00:11
03.00 B
crud.jst744.00 B03-12-07 00:11
rdf.jst284.00 B03-12-07 00:11
rss.jst272.00 B03-12-07 00:11
unit_test.jst493.00 B03-12-07 00:11
unit_test_js.jst765.00 B03-12-07 00:11
jst_demo.html1.68 kB03-12-07 00:11
03.00 B
MANIFEST.MF106.00 B03-12-07 00:11
mvcPic.html1.05 kB03-12-07 00:11
rss_reader.html1.20 kB03-12-07 00:11
03.00 B
auto_suggest.js665.00 B03-12-07 00:11
crud.js1.41 kB03-12-07 00:11
portal.js4.66 kB03-12-07 00:11
rss_reader.js642.00 B03-12-07 00:11
unit_test.js15.89 kB03-12-07 00:11
swato.jar56.50 kB08-04-08 10:57
test.html18.36 kB03-12-07 00:11
unit_test.html1.03 kB03-12-07 00:11
03.00 B
03.00 B
03.00 B
03.00 B
JSONArray.class8.16 kB03-12-07 00:11
JSONObject$1.class199.00 B03-12-07 00:11
JSONObject$Null.class860.00 B03-12-07 00:11
JSONObject.class10.41 kB03-12-07 00:11
JSONTokener.class5.17 kB03-12-07 00:11
03.00 B
03.00 B
03.00 B
CountryList.class2.52 kB03-12-07 00:11
LabelValueBean$1.class825.00 B03-12-07 00:11
LabelValueBean.class2.15 kB03-12-07 00:11
LabelValueBeanTest.class1.88 kB03-12-07 00:11
ObjA.class571.00 B03-12-07 00:11
ObjB.class571.00 B03-12-07 00:11
Test$1.class565.00 B03-12-07 00:11
Test$2.class714.00 B03-12-07 00:11
Test$Foo.class231.00 B03-12-07 00:11
Test$InnerFoo.class643.00 B03-12-07 00:11
Test$InnerSubTestBean.class520.00 B03-12-07 00:11
Test$StaticInnerSubTestBean.class437.00 B03-12-07 00:11
Test$TestBeanInvocationHandler.class1.56 kB03-12-07 00:11
Test.class13.72 kB03-12-07 00:11
TestBean.class1.27 kB03-12-07 00:11
User.class1.65 kB03-12-07 00:11
UserManager.class2.27 kB03-12-07 00:11
JSONConverter.class8.00 kB03-12-07 00:11
JSONConverterTest$1.class240.00 B03-12-07 00:11
JSONConverterTest$TestBean.class1.73 kB03-12-07 00:11
JSONConverterTest.class6.13 kB03-12-07 00:11
03.00 B
JSONRequest.class2.96 kB03-12-07 00:11
JSONResponse.class2.41 kB03-12-07 00:11
JSONServlet.class4.00 kB03-12-07 00:11
PropsFileContext.class3.48 kB03-12-07 00:11
RequestAware.class198.00 B03-12-07 00:11
RequestParameterHolder.class2.36 kB03-12-07 00:11
RequestParameterRecorder.class2.17 kB03-12-07 00:11
RequestRedirector.class2.78 kB03-12-07 00:11
ServiceContext.class243.00 B03-12-07 00:11
SessionAware.class191.00 B03-12-07 00:11
SpringContext.class1.39 kB03-12-07 00:11
SwatoActionProxy.class4.86 kB03-12-07 00:11
SwatoVisible.class396.00 B03-12-07 00:11
03.00 B
Pipe.class2.02 kB03-12-07 00:11
Utils.class632.00 B03-12-07 00:11
services.properties168.00 B03-12-07 00:11
services.xml881.00 B03-12-07 00:11
03.00 B
commons-httpclient-2.0.2.jar220.09 kB03-12-07 00:11
commons-logging.jar37.12 kB03-12-07 00:11
spring-beans.jar213.99 kB03-12-07 00:11
spring-context.jar100.22 kB03-12-07 00:11
spring-core.jar71.98 kB03-12-07 00:11
web.xml1.58 kB03-12-07 00:11
...
Sponsored links

jkl-floating.js (884.61 kB)

Need 1 point
Your Point(s)

Your Point isn't enough.

Get point immediately by PayPal

More(Debit card / Credit card / PayPal Credit / Online Banking)

Submit your source codes. Get more point

LOGIN

Don't have an account? Register now
Need any help?
Mail to: support@codeforge.com

切换到中文版?

CodeForge Chinese Version
CodeForge English Version

Where are you going?

^_^"Oops ...

Sorry!This guy is mysterious, its blog hasn't been opened, try another, please!
OK

Warm tip!

CodeForge to FavoriteFavorite by Ctrl+D