Home > Article > Web Front-end > Complete example of floating window that can be zoomed, dragged, closed and minimized with JS_javascript skills
Complete example of floating window that can be zoomed, dragged, closed and minimized with JS_javascript skills
- WBOYOriginal
- 2016-05-16 16:11:091655browse
The example in this article describes the JS method of implementing a floating window that can be zoomed, dragged, closed and minimized. Share it with everyone for your reference. The specific implementation method is as follows:
Copy code The code is as follows:
<script><br> //dragClass(ID, window title, content, X coordinate, Y coordinate, width, length)<br> var c1="Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1 Window 1";<br> objWin1=new dragClass('win1','Drag window 1',c1,0,150,300,300);<br> var c2="Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2 Window 2";<br> objWin2=new dragClass('win2','Drag window 2',c2,350,150,300,300);<br> var objWin3;<br> function openWin(){<br> if(objWin3==null){<br> var c3="123 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 windows 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3 window 3";<br> objWin3=new dragClass('win3',c3,c3,700,150,300,300);<br> }else{<br> If(objWin3.Window.style.display=='none'){<br> objWin3.Window.style.display='';<br> }<br> }<br> }<br> </script>
I hope this article will be helpful to everyone’s JavaScript programming design.
Statement：
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
Previous article：In-depth understanding of JavaScript series (30): Detailed explanation of appearance pattern of design patterns_Basic knowledgeNext article：In-depth understanding of JavaScript series (30): Detailed explanation of appearance pattern of design patterns_Basic knowledge
Related articles
See more- An in-depth analysis of the Bootstrap list group component
- Detailed explanation of JavaScript function currying
- Complete example of JS password generation and strength detection (with demo source code download)
- Angularjs integrates WeChat UI (weui)
- How to quickly switch between Traditional Chinese and Simplified Chinese with JavaScript and the trick for websites to support switching between Simplified and Traditional Chinese_javascript skills