jQuery - metodo offset ()

Descrizione

Il offset( ) ottiene l'offset corrente del primo elemento corrispondente, in pixel, rispetto al documento.

L'oggetto restituito contiene due proprietà Float, in alto e a sinistra. I browser di solito arrotondano questi valori al pixel intero più vicino per il posizionamento effettivo. Il metodo funziona solo con elementi visibili.

Sintassi

Ecco la semplice sintassi per utilizzare questo metodo:

selector.offset( )

Parametri

Ecco la descrizione di tutti i parametri utilizzati da questo metodo:

  • NA

Esempio

Di seguito è riportato un semplice esempio che mostra l'uso di questo metodo:

<html>
   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript" 
         src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>
		
      <script type = "text/javascript" language = "javascript">
         $(document).ready(function() {
			
            $("div").click(function () {
               var offset = $(this).offset();
               $("#lresult").html("left offset: <span>" + offset.left + "</span>.");
               $("#tresult").html("top offset: <span>" + offset.top + "</span>.");
            });
				
         });
      </script>
		
      <style>
         div { width:60px; height:60px; margin:5px; float:left; }
      </style>
   </head>
	
   <body>
      <p>Click on any square:</p>
      <span id = "lresult"> </span>
      <span id = "tresult"> </span>
		
      <div style = "background-color:blue;"></div>
      <div style = "background-color:pink;"></div>
      <div style = "background-color:#123456;"></div>
      <div style = "background-color:#f11;"></div>
   </body>
</html>

Questo produrrà il seguente risultato:

jquery-css.htm