English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

jQuery实现磁力图片跟随效果完整示例

Questa esempio dimostra come implementare l'effetto di seguimento dell'immagine magnetica con jQuery. Condivido con tutti per riferimento, come segue:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Immagine magnetica</title>
  <style type="text/css">
    #imgSel{position:absolute;}
  </style>
  <script src="../js/jquery-1.5.1.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $("function () {
      $("document").mousemove(function (e) {
        $("#imgSel").animate({"left":e.pageX,"top":e.pageY},0.1);
      });
    });
  </script>
</head>
<body>
  <img id="imgSel" src="../images/select.JPG" />
</body>
</html>

Per chi è interessato a ulteriori contenuti jQuery, è possibile consultare le sezioni speciali di questo sito: 'Sommario delle tecniche e degli effetti di jQuery', 'Sommario delle tecniche di estensione jQuery', 'Sommario degli plugin jQuery e delle loro applicazioni', 'Sommario delle tecniche e degli effetti di trascinamento jQuery', 'Riepilogo delle tecniche di gestione delle tabelle (table) jQuery', 'Sommario dell'uso di Ajax in jQuery', 'Riepilogo degli effetti classici jQuery', 'Sommario dell'uso di animazioni e effetti jQuery' e 'Sommario delle tecniche di selezione degli elementi jQuery'.

Spero che il contenuto di questo articolo possa essere utile per la programmazione jQuery di tutti.

Dichiarazione: il contenuto di questo articolo è stato tratto da Internet, è di proprietà del rispettivo autore, il contenuto è stato contribuito e caricato autonomamente dagli utenti di Internet, questo sito non detiene i diritti di proprietà, non è stato editato manualmente e non assume responsabilità legali correlate. Se trovi contenuti sospetti di violazione del copyright, è possibile inviare una e-mail a notice#oldtoolbag.com (sostituisci # con @ durante l'invio dell'e-mail) per segnalare il problema e fornire prove pertinenti. Una volta verificata la veridicità, questo sito eliminerà immediatamente i contenuti sospetti di violazione del copyright.