Trageți și plasați imagini cursorul mouse-ului oriunde pe site-ul

Cum face acest script? Mai jos veti vedea trei imagini (imagini). Faceți clic pe butonul mouse-ului din stânga pe oricare dintre aceste imagini și glisați oriunde pe ecran.

În același mod, puteți muta, și text. Încercați „ponosit“ este afișat mai jos:

Trageți acest text!

Cum să pună în aplicare, practic, acest lucru script pe site? Să recunoaștem.

1. Creați un fișier sau drag.css stylesheets dacă site-ul dvs. are deja un stylesheet pur și simplu să-l atașează codul din Listarea 1:

Conectarea foaia de stil la pagina web. Pentru a face acest lucru, pune acest cod în Listing 2 între tag-uri și :

Dacă adăugați un stil vizual (codul din Listarea 1) la o foaie de stil existent, atunci săriți peste acest pas.

var dragobject = z: 0, x: 0, y: 0, offsetx. nul, offsety. nul, targetobj. nul, dragapproved. 0
inițializa: funcția () document.onmousedown = this.drag
document.onmouseup = function ()
>
trageți: funcția (e) var evtobj = window.event? window.event. e
this.targetobj = window.event? event.srcElement. e.target
if (this.targetobj.className == "trage") this.dragapproved = 1
if (isNaN (parseInt (this.targetobj.style.left)))
if (isNaN (parseInt (this.targetobj.style.top)))
this.offsetx = parseInt (this.targetobj.style.left)
this.offsety = parseInt (this.targetobj.style.top)
this.x = evtobj.clientX
this.y = evtobj.clientY
if (evtobj.preventDefault)
evtobj.preventDefault ()
document.onmousemove = dragobject.moveit
>
>
moveit: Funcția (e) var evtobj = window.event? window.event. e
if (== this.dragapproved 1) this.targetobj.style.left = this.offsetx + evtobj.clientX-this.x + "px"
this.targetobj.style.top = this.offsety + evtobj.clientY-this.y + "px"
return false
>
>
>
dragobject.initialize ()

3. În pagina de web-site-ul în cazul în care doriți să afișați imaginea, introduceți codul din listingul 5:

Am fișierele de imagine sunt numite: www.png. my.png și reb.png. Rețineți că imaginea fișierele sunt realizate în format .PNG. Desigur, puteți utiliza orice format de imagine, de exemplu: .JPG sau .GIF. dar, în acest caz, este mai convenabil de a utiliza formatul .PNG. Deoarece imaginea, puteți specifica un fundal transparent (transparență).

În cazul în care există o nevoie de a aplica un efect pentru a trage o casetă de text, utilizați codul din Listarea 6. Stilul textului ajusta pe placul dumneavoastră.

Trageți acest text!

Asta e de fapt tot.

A se vedea, de asemenea, alte materiale noastre.

Cum să se înregistreze în calitate de întreprinzător individual (SP)

Script-ul: salut, în funcție de momentul zilei

Cum sa faci site-ul liniilor de rulare

creșterea treptată a imaginii atunci când treceți

Permiteți accesul la această informație cu prietenii tăi!

lecții HTML

clase CSS

Articole

instrumente

Site-ul șabloane

cărți

ornamentare

Site-ul de la A la Z

Face bani online

Cheating pe Internet

protecția muncii

TIPAR MODULAR

PHP LECȚII

servicii

script-uri

SEO

jQuery

Condiții speciale de muncă (sud-est) - ARM

Sistemul de plăți pe Internet

Tutoriale Photoshop

secțiunea secretă

Cu noi face site-ul
Copilul poate chiar!
"Site-ul A la Z"
Află acum >>>

Vrei să câștigi?
2 Urovnevaja
Program de afiliere!
Alatura-te acum.

Modelul modular: catifea de lux roșu

Modular Abstractizarea model: energie solară

Modelul modular: trandafiri albastru

Modelul modular: Cascada

Modelul modular: Orchids

domeniul de înregistrare

"PK" LyuksStroy "

Dacă vă place
site-ul nostru, set
link-ul nostru. și
Ia-Cadouri.