Question

为什么我看到所有面板都在第一页上加载而不是只有一个具有“已选择”属性的面板的任何想法？

我的HTML看起来像这样：

    <div  id="afui">

        <div id="content">
            <div title="Home" id="main" class="panel"  data-header="none" data-footer="none" selected="true">

                <div id="main-container" class="container-fluid">

                    <div class="row">
                        <div class="logo-container">
                            <img src="img/mr_scan.png">
                        </div>
                    </div>

                    <div class="row text-container ">
                        <div>
                            <h1 class="title">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu</h1>    
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna</p>
                        </div>
                    </div>

                    <div class="row">
                        <a href="#page_scratch"><button  type="submit" class="col-xs-12 start-button">POKRENI</button></a>
                    </div>
                </div>

            </div>      
            <div id="page_scratch" data-title="Scratch" class="panel" data-header="none" data-defer="scratch.html" data-load="intialiseScratch"  >

            </div>   
        </div>     
    </div>

对于脚本加载顺序，它是这样的：

    <script type="text/javascript" charset="utf-8" src="js/jquery.1.11.0.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="js/af.ui.jquery.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="intelxdk.js"></script>
    <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
    <script type="text/javascript" charset="utf-8" src="xhr.js"></script>
    <script type="text/javascript" src="js/wScratchPad.min.js "></script>

    <script type="text/javascript">
        $.ui.autoLaunch = false;
        /* Intel native bridge is available */
        var onDeviceReady = function() {

            intel.xdk.device.setRotateOrientation("portrait");
            intel.xdk.device.setAutoRotate(false);
            webRoot = intel.xdk.webRoot + "";
            //hide splash screen
            $.ui.launch();
            intel.xdk.device.hideSplashScreen();
            $.feat.nativeTouchScroll = true;
            $.ui.slideSideMenu = false;

        };
        document.addEventListener("intel.xdk.device.ready", onDeviceReady, false);
    </script>

Answer 1

您还必须加入appframework stylesheet：

<link rel="stylesheet" type="text/css" href="af.ui.css"  />

英特尔应用框架所有面板在启动时加载

1 个答案: