Question

我已经查看了有关Slik Carousel的其他答案，我似乎无法解决我的问题。正如在其他答案中所建议的那样，我试图在我和我使用CDN托管的js和css文件但它仍然无效。我尽我所能遵循http://kenwheeler.github.io/slick/上的说明，但我没有让它工作得很好。我真的不是很好的Javascript所以你的家伙和女孩的任何意见非常感谢。这是我现在的代码。

 <div class="featured-areas responsive">
 <div><a href="/lake-oswego-or-homes-for-sale"><img src="/wp-content/uploads/2015/09/lakeoswegojpg.jpg"/></a><a href="/lake-oswego-or-homes-for-sale"><h3 style="text-align:center;">Lake Oswego Homes for Sale</h3></a></div>
  <div><a href="/lake-oswego-or-homes-for-sale"><img src="/wp-content/uploads/2015/09/lakeoswegojpg.jpg"/></a><a href="/lake-oswego-or-homes-for-sale"><h3 style="text-align:center;">Lake Oswego Homes for Sale</h3></a></div>
  <div><a href="/lake-oswego-or-homes-for-sale"><img src="/wp-content/uploads/2015/09/lakeoswegojpg.jpg"/></a><a href="/lake-oswego-or-homes-for-sale"><h3 style="text-align:center;">Lake Oswego Homes for Sale</h3></a></div>
  <div><a href="/lake-oswego-or-homes-for-sale"><img src="/wp-content/uploads/2015/09/lakeoswegojpg.jpg"/></a><a href="/lake-oswego-or-homes-for-sale"><h3 style="text-align:center;">Lake Oswego Homes for Sale</h3></a></div>
  <div><a href="/lake-oswego-or-homes-for-sale"><img src="/wp-content/uploads/2015/09/lakeoswegojpg.jpg"/></a><a href="/lake-oswego-or-homes-for-sale"><h3 style="text-align:center;">Lake Oswego Homes for Sale</h3></a></div>
  <div><a href="/lake-oswego-or-homes-for-sale"><img src="/wp-content/uploads/2015/09/lakeoswegojpg.jpg"/></a><a href="/lake-oswego-or-homes-for-sale"><h3 style="text-align:center;">Lake Oswego Homes for Sale</h3></a></div>
</div>
<script type="text/javascript">$('.responsive').slick({
  dots: true,
  infinite: false,
  speed: 300,
  slidesToShow: 4,
  slidesToScroll: 4,
  responsive: [
    {
      breakpoint: 1024,
      settings: {
        slidesToShow: 3,
        slidesToScroll: 3,
        infinite: true,
        dots: true
      }
    },
    {
      breakpoint: 600,
      settings: {
        slidesToShow: 2,
        slidesToScroll: 2
      }
    },
    {
      breakpoint: 480,
      settings: {
        slidesToShow: 1,
        slidesToScroll: 1
      }
    }
    // You can unslick at a given breakpoint now by adding:
    // settings: "unslick"
    // instead of a settings object
  ]
});
</script>

可以在测试网址上查看网站，因为名称服务器尚未指向。我很感激这个帮助，因为这对我来说是一个很好的教育，能够带给我的客户。

似乎临时链接不起作用，用于生成链接的站点也不起作用。要查看该站点，请将该行添加到hosts文件：108.178.13.98 findlakeoswegohomes.com

在wp-head.php文件中：

   <?php

// =============================================================================
// VIEWS/INTEGRITY/WP-HEADER.PHP
// -----------------------------------------------------------------------------
// Header output for Integrity.
// =============================================================================

?>

<?php x_get_view( 'global', '_header' ); ?>

  <?php x_get_view( 'global', '_slider-above' ); ?>

  <header class="<?php x_masthead_class(); ?>" role="banner">
    <?php x_get_view( 'global', '_topbar' ); ?>
    <?php x_get_view( 'global', '_navbar' ); ?>
    <?php x_get_view( 'integrity', '_breadcrumbs' ); ?>
    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/jquery.slick/1.4.1/slick.css"/>
  </header>

  <?php x_get_view( 'global', '_slider-below' ); ?>
  <?php x_get_view( 'integrity', '_landmark-header' ); ?>

然后在footer.php文件中：

<?php

// =============================================================================
// VIEWS/GLOBAL/_FOOTER.PHP
// -----------------------------------------------------------------------------
// Includes the wp_footer() hook and closes out the <body> and <html> tags.
// =============================================================================

?>

  <?php do_action( 'x_before_site_end' ); ?>

  </div> <!-- END #top.site -->

  <?php do_action( 'x_after_site_end' ); ?>

<?php wp_footer(); ?>
<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery.slick/1.4.1/slick.min.js"></script>
</body>
</html>

我确实将css和js文件加载到名为“slick”的服务器上的一个文件夹中，并将样式表和js链接起来，但它没有用，所以我想我会尝试将CDN版本的文件检查到看看那是不是错误。

Answer 1

您的javascript代码未包含在文档中，请尝试将您的javascript代码放入其中：

<!-- Special_ID -->
<p>
 test
</p>
<!-- /Special_ID -->

确保在上面的$(function(){ // Your Code Here });之前包含jQuery库。还要确保包含实际的Slick Carousel javascript文件（在jQuery库之后）。

光滑的Carousel集成无法正常工作

1 个答案: