Environment
ruby-1.9.3-p0, rails3.2.2, postgres, Twitter Bootstrap v2.1
If you want to implement data loading like twitter, I recommend that you use jquery.pageless.
But if you use jquery.pageless, you have to use care when set script file.
I was wrong when I had used with Twitter Bootstrap.
put the script file at the end of the document body
you should put the script file at the end of the document body so you don't block rendering of the page.
Twitter Bootstrap uses bootstrap.js. This file ought to put at the end the document body.
But jquery.pageless.js is not be so. jquery.pageless.js must put the under css link. otherwise, you fail to rendering.
how to put jquery.pageless.js and bootstrap.js
you should put script file like next way.
before<head> <link href="/stylesheets/bootstrap.css" media="screen" rel="stylesheet" type="text/css" /> <link href="/stylesheets/common.css" media="screen" rel="stylesheet" type="text/css" /> <link href="/stylesheets/bootstrap-responsive.css" media="screen" rel="stylesheet" type="text/css" /> </head> <body> // something <script src="/javascripts/jquery.min.js" type="text/javascript"> </script> <script src="/javascripts/bootstrap.js" type="text/javascript"> </script> <script src="/javascripts/jquery.pageless.js" type="text/javascript"> </script> </body>fixed code
<head> <link href="/stylesheets/bootstrap.css" media="screen" rel="stylesheet" type="text/css" /> <link href="/stylesheets/common.css" media="screen" rel="stylesheet" type="text/css" /> <link href="/stylesheets/bootstrap-responsive.css" media="screen" rel="stylesheet" type="text/css" /> <script src="/javascripts/jquery.min.js" type="text/javascript"> </script>// download in head <script src="/javascripts/jquery.pageless.js" type="text/javascript"> </script>// download in head </head> <body> // something <script src="/javascripts/bootstrap.js" type="text/javascript"> </script> </body>
Above code can work. jquery.pageless.js should put at the before of the document head
thanks for reading.
この記事がお役にたちましたらシェアをお願いします
0 件のコメント:
コメントを投稿