これはまったく複雑なプラグインのようには見えませんが、これを機能させることができません - それは私を夢中にさせています. どんな助けでも大歓迎です。月曜日の詳細が欠けていると確信しています。
URL は次のとおりです: 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;
}