Question

我似乎无法在代码中找到问题。似乎#fullpage节选择器由于某种原因无法正常工作。

我确保我的所有部分都处于固定位置，并且仍然无法按预期工作。

我的HTML和CSS ...

    body {
     margin:0;
     padding:0;
     font-family:verdana;
    }
    
    #fullpage {
     height:100vh;
    }
    
    #fullpage section {
     height:100vh;
    }
    
    #fullpage section h1 {
     margin:0;
     padding:0;
     line-height:100vh;
    }
    
    #fullpage section:nth-child(1) {
     background-color:red;
    }
    
    #fullpage section:nth-child(2) {
     background-color:blue;
    }
    
    #fullpage section:nth-child(3) {
     background-color:green;
    }

<!doctype html>
<html>
    <head>
      <meta charset="utf-8">
      <link rel="stylesheet" href="fullpagecss.css">
      <script src="https://cdnjs.cloudflare.com/ajax/libs/fastclick/1.0.6/fastclick.js">
      </script>
      <script src="http://code.jquery.com/jquery-3.4.1.js">
      </script>
      <script src="jquery.fullpage.js">
      </script>
    </head>
    
    <body>
      <div id="fullpage">
        <section><h1>Section 1</h1></section>
        <section><h1>Section 2</h1></section>
        <section><h1>Section 3</h1></section>
      </div>

      <script type="text/javascript">
        FastClick.attach(document.body);
        $('#fullpage').fullpage();
      </script>
    </body>
</html>

真的很困惑为什么它不起作用。

Answer 1

不确定是选择器。可能是标记。小提琴对我不起作用。编辑一些内容：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.7/jquery.fullpage.css" integrity="sha256-l0tJvh77claYa8GowKaFNxtuRWZICtwHTk7+0tgsiZY=" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.js" integrity="sha256-DYZMCC8HTC+QDr5QNaIcfR7VSPtcISykd+6eSmBW5qo=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fastclick/1.0.6/fastclick.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.9.7/jquery.fullpage.extensions.min.js" integrity="sha256-SjXUPmxobD+vLCws0crIzpdBrHgDjs8jamhUMv0eRac=" crossorigin="anonymous"></script>
</head>

<body>

<div id="fullpage">
<section class="section"><h1>Section 1</h1></section>
<section class="section"><h1>Section 2</h1></section>
<section class="section"><h1>Section 3</h1></section>
</div>
</body>
</html>

CSS不变：

JS：

$(document).ready(function() {
  FastClick.attach(document.body);
    $('#fullpage').fullpage({
        //options here
        autoScrolling:true,
        scrollHorizontally: true,
    navigation: true,
      navigationPosition: 'right',
    });
});

甚至不确定那是您正在使用的整页库。初始化时有很多选项。对于这一部分，这些部分显然需要具有class =“ section”。

不知道为什么CSS选择器不起作用

1 个答案: