Jquery Pageslide不工作

时间:2012-08-20 17:49:07

标签: jquery-plugins

这似乎不是一个复杂的插件,但我不能让它工作 - 它让我发疯。任何帮助,将不胜感激。我确定我错过了一些星期一的细节。

以下是网址:http://damon9.com/dev/DC/

单击“继续”按钮应该向右滑动页面

<!DOCTYPE HTML>
<html>
<head>
 <script type="text/javascript" src="lib/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery.pageslide.js"></script>

<script type ="text/javascript">  <!---  I've tried both of these below and some others -->

$("a#resume_btn").pageslide({ direction: "right", modal: true });

$("#resume_btn").pageslide(); 

</script>
</head>
<body>
<a href="#modal" id="resume_btn"></a>


    <div id="modal" style="display:none">

 <p>This slide uses "modal" option set to "true". When using a modal pageslide, clicking on     the main window will not close the window. You must explicitly call <code>$.pageslide.close()</code>.</p>
        <p><a href="javascript:$.pageslide.close()">Close</a></p>

</div>
</body

css

#pageslide {
 /* These styles MUST be included. Do not change. */
 display: none;
 position: absolute;
 position: fixed;
 top: 0;
 height: 100%;
 z-index: 999999;

 /* Specify the width of your pageslide here */
 width: 400px;
 padding: 20px;

 /* These styles are optional, and describe how the pageslide will look */
 background-color: red;
 color: #FFF;
 -webkit-box-shadow: inset 0 0 5px 5px #222;
 -moz-shadow: inset 0 0 5px 5px #222;
 box-shadow: inset 0 0 5px 5px #222;
}

2 个答案:

答案 0 :(得分:9)

尝试放

<script type="text/javascript" src="js/jquery.pageslide.js"></script>
标签前的

</body>

答案 1 :(得分:0)

试试这个,

 <script type ="text/javascript">  
   $(function(){
    $("a#resume_btn").pageslide({ direction: "right", modal: true });
    $("#resume_btn").pageslide(); 
  });
 </script>