Contoh dalam artikel ini menerangkan cara jQuery meniru gmail untuk melaksanakan reka letak tetap. Kongsikan dengan semua orang untuk rujukan anda. Kaedah pelaksanaan khusus adalah seperti berikut:
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>fixed bar demo</title> <style type="text/css" media="screen"> body{ margin:0; height:2000px; } #top{ background-color:#333; height:80px; } #nav{ background-color:#999; height:30px; position:absolute; top:80px; width:100%; } </style> <script src="jquery-1.6.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $(window).scroll(function(){ var scrollTop = $(window).scrollTop(); if(scrollTop < 80) $("#nav").css('top', '80px'); else $("#nav").css('top', scrollTop +'px'); }); }); </script> </head> <body> <div id="top"> </div> <div id="nav"> </div> </body> </html>
Saya harap artikel ini akan membantu pengaturcaraan jQuery semua orang.