Javascript Jquery滑块没有响应-Wordpress

Javascript Jquery滑块没有响应-Wordpress,javascript,php,jquery,css,wordpress,Javascript,Php,Jquery,Css,Wordpress,我正在建立一个响应性很强的WordPress网站,但当涉及到滑块时,它似乎被卡住了。我认为这与我网站上的某些内容相冲突,因为默认主题()有一个响应滑块 这是我正在使用的脚本: //SLIDESHOW jQuery(document).ready(function(){ //HOMEPAGE SLIDES jQuery('.slider-slides').cycle({ speed: 1000, timeout: 4000, fx: 'scrollHorz', n

我正在建立一个响应性很强的WordPress网站,但当涉及到滑块时,它似乎被卡住了。我认为这与我网站上的某些内容相冲突,因为默认主题()有一个响应滑块

这是我正在使用的脚本:

//SLIDESHOW
jQuery(document).ready(function(){

//HOMEPAGE SLIDES
jQuery('.slider-slides').cycle({
    speed: 1000,
    timeout: 4000,
    fx: 'scrollHorz',
    next: '.slider-next', 
    prev: '.slider-prev',
    pager: '.slider-pages',
    pause: true,
    pauseOnPagerHover: true,
    containerResize: false,
    slideResize: false,
    fit: 1
}); 
jQuery('.slider-prev, .slider-next').click(function(){
    jQuery('.slider-slides').cycle('pause');
});
    jQuery(window).scroll(function(){
    if(jQuery(document).scrollTop() > 500)
        jQuery('#toplink').addClass('active');
    else
        jQuery('#toplink').removeClass('active');
});
}); 
function slide_resize(curr, next, opts, fwd) {
var ht = jQuery(this).height();
jQuery(this).parent().animate({height: ht}); 
}
我尝试将调整大小选项更改为true,但没有任何更改。我试着向代码中添加宽度:100%和高度:450px,正如其他地方建议的那样,但这也没有改变任何事情

我真是束手无策!如果有人有什么建议,那就太棒了。谢谢大家!

下面是我的header.php:

<?php if(cpotheme_get_option('cpo_slider_always') == 1 || is_front_page()){ ?>
        <?php $feature_args = array(
        'post_type' => array('post', 'page'),
        'meta_key' => 'page_featured',
        'meta_value' => 'slider',
        'posts_per_page' => -1,
        'orderby' => 'menu_order',
        'ignore_sticky_posts' => 1,
        'order' => 'ASC'); ?>
        <?php $slider_posts = new WP_Query($feature_args); ?>
        <?php if($slider_posts->post_count > 0): $slide_count = 0; ?>
        <div id="slider" class="slider">
            <ul class="slider-slides">
                <?php while($slider_posts->have_posts()): $slider_posts->the_post(); ?>
                <?php $slide_count++; ?>
                <?php $image_url = wp_get_attachment_image_src(get_post_thumbnail_id(get_the_ID()), array(1500, 7000), false, ''); ?>
                <?php $slide_position = get_post_meta(get_the_ID(), 'slide_position', true); ?>
                <li id="slide_<?php echo $slide_count; ?>" class="slide slide-<?php echo $slide_position; ?>" style="background:url(<?php echo $image_url[0]; ?>) no-repeat center; background-size:cover;">
                    <div class="container">
                        <a class="slide-textbox" href="<?php the_permalink(); ?>">
                            <h2 class="slide-title"><?php the_title(); ?></h2>
                            <div class="slide-content"><?php the_excerpt(); ?></div>
                        </a>
                    </div>
                </li>
                <?php endwhile; ?>
            </ul>
            <?php if($slider_posts->post_count > 1): ?>
            <div class='slider-prev'></div>
            <div class='slider-next'></div>
            <?php endif; ?>
        </div>  
        <?php endif; ?>


        <?php }else{ ?>

        <?php $header_image = get_header_image(); if($header_image != ''): ?>
        <img src="<?php echo $header_image; ?>" class="header-image" />
        <?php endif; ?>

    “class=”标题图像“/>
您似乎没有将
slide\u resize
绑定到任何对象。该函数存在,但不会在任何地方调用。如果您碰巧在其他地方调用了它,但没有显示:

“滑块”本身和“滑块”本身都会收缩,以实现移动响应(至少宽度)。您只需要担心滑块的高度,而不需要担心图像本身。类似这样的操作应该可以解决问题(抱歉语法错误):


首先,resize函数slide\u resize需要绑定到一个观察显示大小的事件。现在,据我所知,根本没有任何东西在调用该函数。啊,我明白了。我对jquery很陌生,你知道我该如何调用该函数吗?如果我向你展示我在header.php中的内容,会有帮助吗?谢谢!编辑-添加了my header.php,可能会有帮助。谢谢!我不确定是否在任何地方调用过它。我对这方面的工作都很陌生。如果我在调用滑块的header.php中发布我的内容会有帮助吗?编辑-添加标题代码。尝试添加
jQuery('.slider slides')。slide_resize();
在你的底部JavaScriptor否则,将我写的代码添加到它的底部,它应该可以为你处理它的高度(宽度已经工作了)谢谢你的帮助。我想我已经让它工作了!干杯!:)太好了!如果有帮助,你介意接受答案吗?:)
jQuery(window).on('resize', function(){
    var currentWidth = jQuery('.slider-slides .container').width();
    var newHeight = currentWidth / 2.444; //2.444 is your 1100/450 from the full size slider
    ('.slider-slides .container').height(newHeight); //Container height
    jQuery('.slider-slides .slide').height(newHeight); // Slide wrap's height
});