热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

猫头鹰旋转木马不工作,也许我连接错误的东西?

如何解决《猫头鹰旋转木马不工作,也许我连接错误的东西?》经验,为你挑选了2个好方法。

我试图在我的新项目中使用猫头鹰旋转木马.我似乎遇到了问题.到目前为止,只有HTML和CSS正在运行.我在某种程度上做错了脚本.有人可能借给我一只手,看看我指向正确的方向,我搞砸了吗?

这是该网站的链接.Owl Carousel靠近网站的底部.您将看到两个"合作伙伴"部分.顶部只是演示HTML,底部是我试图用来创建carouse.我暂时只使用虚拟图像.CloudPoint DIV站点

这是我从中获取代码的网站.猫头鹰旋转木马演示

以下是代码的一些片段.如果您需要任何进一步的细节,我会尽力提供.

.grayscale {
  border: 0px solid black;
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
  /* For Webkit browsers */
  filter: gray;
  /* For IE 6 - 9 */
  -webkit-transition: all .6s ease;
  /* Transition for Webkit browsers */
}

.grayscale:hover {
  filter: grayscale(0%);
  -webkit-filter: grayscale(0%);
  filter: none;
}


#owl-demo .owl-item{
  margin: 3px;
}
#owl-demo .owl-item img{
  display: block;
  width: 100%;
  height: auto;
}
Owl Image
Owl Image
Owl Image
Owl Image
Owl Image
Owl Image
Owl Image
Owl Image

_('CloudPoint Right Sidebar'),
        'id' => 'right-sidebar',
        'description' =>_('widgets in this area will be shown on the right-hand side.'),
		'before_widget' => '
', 'after_widget' => '
', 'before_title' => '', )); } // ******************* Add Custom search ****************** // add_theme_support('html5', array('search-form')); // ******************* Add Custom Menus ****************** // add_theme_support( 'menus' ); // ******************* Add Custom Excerpt Lengths ****************** // function wpe_excerptlength_index($length) { return 160; } function wpe_excerptmore($more) { return '...Read More >'; } function wpe_excerpt($length_callback='', $more_callback='') { global $post; if(function_exists($length_callback)){ add_filter('excerpt_length', $length_callback); } if(function_exists($more_callback)){ add_filter('excerpt_more', $more_callback); } $output = get_the_excerpt(); $output = apply_filters('wptexturize', $output); $output = apply_filters('convert_chars', $output); $output = '

'.$output.'

'; echo $output; } // ******************* Add Post Thumbnails ****************** // add_theme_support( 'post-thumbnails' ); set_post_thumbnail_size( 50, 50, true ); add_image_size( 'full-width-ratio', 100, 9999 ); // ******************* Add Custom Post Types & Taxonomies ****************** // register_post_type('custom', array( 'label' => __('Custom Post Type'), 'singular_label' => __('Custom Post Type'), 'public' => true, 'show_ui' => true, 'capability_type' => 'post', 'hierarchical' => false, 'rewrite' => true, 'query_var' => false, 'has_archive' => true, 'supports' => array('title', 'editor', 'author') )); add_action( 'init', 'build_taxonomies', 0 ); function build_taxonomies() { register_taxonomy( 'taxo', 'custom', array( 'hierarchical' => true, 'label' => 'Custom Taxonomy', 'query_var' => true, 'rewrite' => true ) ); } // ******************* Add Options to Theme Customizer ****************** // function themename_customize_register($wp_customize){ $wp_customize->add_section('themename_color_scheme', array( 'title' => __('Color Scheme', 'themename'), 'priority' => 120, )); // ============================= // = Text Input = // ============================= $wp_customize->add_setting('themename_theme_options[text_test]', array( 'default' => 'Arse!', 'capability' => 'edit_theme_options', 'type' => 'option', )); $wp_customize->add_control('themename_text_test', array( 'label' => __('Text Test', 'themename'), 'section' => 'themename_color_scheme', 'settings' => 'themename_theme_options[text_test]', )); } add_action('customize_register', 'themename_customize_register'); // ******************* Add Shortcode ****************** // function secondaryCallout($atts, $cOntent= null) { extract(shortcode_atts(array( 'link' => '#', 'link_title' => '', 'content' => '', ), $atts)); $out = '
'.$content.' '.$link_title.' >
'; return $out; } add_shortcode('secondary_callout', 'secondaryCallout'); add_filter('widget_text', 'do_shortcode'); // ******************* Include styles Properly ****************** // add_action('init','theme_enqueue_styles'); function theme_enqueue_styles() { wp_enqueue_style( 'them_main', get_stylesheet_directory_uri().'/css/boilerplate.css' ); wp_enqueue_style( 'them_extra1', get_stylesheet_directory_uri().'/css/normalize.css' ); wp_enqueue_style( 'them_extra2', get_stylesheet_directory_uri().'/css/animate.css' ); wp_enqueue_style( 'them_extra3', get_stylesheet_directory_uri().'/css/component.css' ); wp_enqueue_style( 'them_extra4', get_stylesheet_directory_uri().'/css/home.css' ); wp_enqueue_style( 'them_extra5', get_stylesheet_directory_uri().'/css/landing_page.css' ); wp_enqueue_style( 'them_extra5', get_stylesheet_directory_uri().'/css/owl.carousel.css' ); wp_enqueue_style( 'them_extra5', get_stylesheet_directory_uri().'/css/owl.transitions.css' ); wp_enqueue_style( 'them_extra5', get_stylesheet_directory_uri().'/css/bootstrapTheme.css' ); } // ******************* Include jQuery Properly ****************** // function my_init() { if (!is_admin()) add_action("wp_enqueue_scripts", "my_jquery_enqueue", 11); function my_jquery_enqueue() { wp_deregister_script('jquery'); wp_register_script('jquery', "http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js", false, '2.0.3', true); wp_enqueue_script('jquery'); //load a JS file from by theme: js/theme.js wp_enqueue_script('my_script2', get_bloginfo('template_url') . '/js/modernizr.custom.js', array('jquery'), '1.0',true); wp_enqueue_script('my_script2', get_bloginfo('template_url') . '/js/script.js', array('jquery'), '1.0',true); wp_enqueue_script('my_script2', get_bloginfo('template_url') . '/js/imagesloaded.js', array('jquery'), '1.0',true); wp_enqueue_script('my_script2', get_bloginfo('template_url') . '/js/skrollr.js', array('jquery'), '1.0',true); wp_enqueue_script('my_script2', get_bloginfo('template_url') . '/js/owl.carousel.js', array('jquery'), '1.0',true); wp_enqueue_script('my_script2', get_bloginfo('template_url') . '/js/owl.carousel.min.js', array('jquery'), '1.0',true); } } add_action('init','my_init'); ?>



1> slicedtoad..:

好的,我已经修好了片段.

我修的东西:

添加了jquery脚本

jquery 之后添加了owlcarousel脚本和css

正确关闭JS括号.

建议:

使用浏览器的控制台.f12应该打开它然后很容易找到错误.

您的代码很少"只是工作",您需要知道如何调试它(这在Web开发中非常容易)

$(document).ready(function() {

  $("#owl-demo").owlCarousel({

    autoPlay: 3000, //Set AutoPlay to 3 seconds

    items: 4,
    itemsDesktop: [1199, 3],
    itemsDesktopSmall: [979, 3]

  });
}); // Notice there need to be two sets of closing brackets! One for the .ready and one for the carousel.
.grayscale {
  border: 0px solid black;
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
  /* For Webkit browsers */
  filter: gray;
  /* For IE 6 - 9 */
  -webkit-transition: all .6s ease;
  /* Transition for Webkit browsers */
}
.grayscale:hover {
  filter: grayscale(0%);
  -webkit-filter: grayscale(0%);
  filter: none;
}
#owl-demo .owl-item {
  margin: 3px;
}
#owl-demo .owl-item img {
  display: block;
  width: 100%;
  height: auto;
}




Owl Image
Owl Image
Owl Image
Owl Image
Owl Image
Owl Image
Owl Image
Owl Image


2> 小智..:

问题是您需要将"item"指定为1才能响应,

这是工作代码

$(".owl-carousel").owlCarousel({
      autoPlay: 3000,
      items : 1, // THIS IS IMPORTANT
      responsive : {
            480 : { items : 1  }, // from zero to 480 screen width 4 items
            768 : { items : 2  }, // from 480 screen widthto 768 6 items
            1024 : { items : 3   // from 768 screen width to 1024 8 items
            }
        },
  });


推荐阅读
  • 本文介绍了如何在Jquery中通过元素的样式值获取元素,并将其赋值给一个变量。提供了5种解决方案供参考。 ... [详细]
  • Html5-Canvas实现简易的抽奖转盘效果
    本文介绍了如何使用Html5和Canvas标签来实现简易的抽奖转盘效果,同时使用了jQueryRotate.js旋转插件。文章中给出了主要的html和css代码,并展示了实现的基本效果。 ... [详细]
  • 本文介绍了lua语言中闭包的特性及其在模式匹配、日期处理、编译和模块化等方面的应用。lua中的闭包是严格遵循词法定界的第一类值,函数可以作为变量自由传递,也可以作为参数传递给其他函数。这些特性使得lua语言具有极大的灵活性,为程序开发带来了便利。 ... [详细]
  • Voicewo在线语音识别转换jQuery插件的特点和示例
    本文介绍了一款名为Voicewo的在线语音识别转换jQuery插件,该插件具有快速、架构、风格、扩展和兼容等特点,适合在互联网应用中使用。同时还提供了一个快速示例供开发人员参考。 ... [详细]
  • Ihavethefollowingonhtml我在html上有以下内容<html><head><scriptsrc..3003_Tes ... [详细]
  • HTML5网页模板怎么加百度统计?
    本文介绍了如何在HTML5网页模板中加入百度统计,并对模板文件、css样式表、js插件库等内容进行了说明。同时还解答了关于HTML5网页模板的使用方法、表单提交、域名和空间的问题,并介绍了如何使用Visual Studio 2010创建HTML5模板。此外,还提到了使用Jquery编写美好的HTML5前端框架模板的方法,以及制作企业HTML5网站模板和支持HTML5的CMS。 ... [详细]
  • Android实战——jsoup实现网络爬虫,糗事百科项目的起步
    本文介绍了Android实战中使用jsoup实现网络爬虫的方法,以糗事百科项目为例。对于初学者来说,数据源的缺乏是做项目的最大烦恼之一。本文讲述了如何使用网络爬虫获取数据,并以糗事百科作为练手项目。同时,提到了使用jsoup需要结合前端基础知识,以及如果学过JS的话可以更轻松地使用该框架。 ... [详细]
  • express工程中的json调用方法
    本文介绍了在express工程中如何调用json数据,包括建立app.js文件、创建数据接口以及获取全部数据和typeid为1的数据的方法。 ... [详细]
  • 阿里Treebased Deep Match(TDM) 学习笔记及技术发展回顾
    本文介绍了阿里Treebased Deep Match(TDM)的学习笔记,同时回顾了工业界技术发展的几代演进。从基于统计的启发式规则方法到基于内积模型的向量检索方法,再到引入复杂深度学习模型的下一代匹配技术。文章详细解释了基于统计的启发式规则方法和基于内积模型的向量检索方法的原理和应用,并介绍了TDM的背景和优势。最后,文章提到了向量距离和基于向量聚类的索引结构对于加速匹配效率的作用。本文对于理解TDM的学习过程和了解匹配技术的发展具有重要意义。 ... [详细]
  • GetWindowLong函数
    今天在看一个代码里头写了GetWindowLong(hwnd,0),我当时就有点费解,靠,上网搜索函数原型说明,死活找不到第 ... [详细]
  • Java实战之电影在线观看系统的实现
    本文介绍了Java实战之电影在线观看系统的实现过程。首先对项目进行了简述,然后展示了系统的效果图。接着介绍了系统的核心代码,包括后台用户管理控制器、电影管理控制器和前台电影控制器。最后对项目的环境配置和使用的技术进行了说明,包括JSP、Spring、SpringMVC、MyBatis、html、css、JavaScript、JQuery、Ajax、layui和maven等。 ... [详细]
  • HDU 2372 El Dorado(DP)的最长上升子序列长度求解方法
    本文介绍了解决HDU 2372 El Dorado问题的一种动态规划方法,通过循环k的方式求解最长上升子序列的长度。具体实现过程包括初始化dp数组、读取数列、计算最长上升子序列长度等步骤。 ... [详细]
  • CSS3选择器的使用方法详解,提高Web开发效率和精准度
    本文详细介绍了CSS3新增的选择器方法,包括属性选择器的使用。通过CSS3选择器,可以提高Web开发的效率和精准度,使得查找元素更加方便和快捷。同时,本文还对属性选择器的各种用法进行了详细解释,并给出了相应的代码示例。通过学习本文,读者可以更好地掌握CSS3选择器的使用方法,提升自己的Web开发能力。 ... [详细]
  • 本文介绍了在SpringBoot中集成thymeleaf前端模版的配置步骤,包括在application.properties配置文件中添加thymeleaf的配置信息,引入thymeleaf的jar包,以及创建PageController并添加index方法。 ... [详细]
  • 高质量SQL书写的30条建议
    本文提供了30条关于优化SQL的建议,包括避免使用select *,使用具体字段,以及使用limit 1等。这些建议是基于实际开发经验总结出来的,旨在帮助读者优化SQL查询。 ... [详细]
author-avatar
吕志心可和
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有