0

我在这个网页上有一些我想复制的很棒的单页实现。

我希望能够使用网页等菜单链接来切换内容框（和背景图像）。有没有现成的 jQuery 插件可用？

4

3 回答 3

0

试试scrolldeck.js http://johnpolacek.github.io/scrolldeck.js/

或 Fathom.js http://markdalgleish.com/projects/fathom/

于 2013-10-01T00:16:44.533 回答
0 
<!DOCTYPE html>  
<html>      
    <head>      
       <title>Sample Page</title>           
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-   1.0.min.css" />    
       <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js">    </script>        
       <script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script> 
</head>   
<body>              
    <div data-role="page" id="page1">      
        <div data-role="header">         
            <h1>
                Page 1
            </h1>     
        </div><!-- /header -->      

        <div data-role="content">
            <a id="changePageButton" data-role="button">Change Page!</a>
        </div><!-- /content -->      

        <div data-role="footer">              
        </div> 
    </div><!-- /page -->      

    <div data-role="page" id="page2">         
        <div data-role="header">    
           <h1>
              Page 2
            </h1>     
        </div><!-- /header -->         

        <div data-role="content">  
            <p>Hooray for page 2!</p>
        </div><!-- /content -->         

        <div data-role="footer">         
        </div><!-- /fotoer -->     

    </div><!-- /page --> 

</body>


$(function() {
    $("#changePageButton").click(function() {
        $.mobile.changePage("#page2");
    });        
});
于 2013-10-01T09:14:11.473 回答
0

这可以通过十几个轮播 JQuery 插件中的任何一个来完成，或者您可以实现 Jquery Mobile 并获得相同的效果。

JQM 的好处可能是您的页面现在也可以移动。

编辑

我通常不喜欢发布链接，但在这种情况下，我认为这个问题对于一个简洁的答案来说有点宽泛，所以这里有一些插件的链接可能会为你完成这项工作。

http://www.designrazzi.com/2013/jquery-slider-plugins/

于 2013-10-01T00:12:48.127 回答