Jquery - 精选内容Slider无法正常工作

时间:2010-11-05 17:47:19

标签: jquery jquery-ui slider featured

好的,这是我的问题。

我花了大约10个小时尝试在我的网站上放置精选内容滑块。尝试任何我能想到的东西。尝试相同滑块的3个不同版本。

网址为:http://www.heartofphoto.com/slidetest/

但无论如何,这就是我现在的目标:

在标题中,我设法得到了这个:

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>
<script type='text/javascript'>try{jQuery.noConflict();}catch(e){};</script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.3/jquery-ui.min.js'></script>

拥有或不拥有“noconflict”部分似乎并没有什么不同。我相信在为Wordpress安装“google libary”插件后,noconflict部分就出现了。

这是我在页面中应该显示滑块的脚本:

<script type="text/javascript">

jQuery(document).ready(function(){
    jQuery("#featured").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
});
</script>

在我制作的“featured.php”文件中有一个,或者在顶部包含的header.php文件中有一个没有区别。

所以任何人都知道我做错了什么?

一些编辑: 我收到错误SCRIPT438:对象不支持slidetest中的这个属性或方法,第139行第3个字符。 这是哪一行:

jQuery("#featured").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);

对于那些想看我的HTML的人。这个版本实际上是使用php设置来获取数据:

<div id="featured" >
      <ul class="ui-tabs-nav">
<?php
$postcount = 0;
$featured_query = new WP_Query('cat=29');
while ($featured_query->have_posts()) : $featured_query->the_post();
    get_the_ID();
    $postcount++;
?>
<?php
// get the image filename
$value_feat_img = get_post_custom_values("thumbnail");
if (isset($value_feat_img[0])) { ?>
        <li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-<?php echo $postcount; ?>"><a href="#fragment-<?php echo $postcount; ?>">

        <img src="<?php echo bloginfo('template_url'); ?>/thumb.php?src=<?php echo get_post_meta($post->ID, "thumbnail", $single = true); ?>&amp;h=50&amp;w=80&amp;zc=1&amp;q=95" alt="<?php the_title(); ?>" /><span><?php the_title(); ?></span></a><?php } ?>
</li>
          <?php endwhile; ?>

      </ul>

<?php
$postcount = 0;
$featured_query = new WP_Query('cat=29');
while ($featured_query->have_posts()) : $featured_query->the_post();
    get_the_ID();
$postcount++;
?>

    <!-- Content -->
    <div id="fragment-<?php echo $postcount; ?>" class="ui-tabs-panel" style="">
    <?php   // get the image filename
                        $value_img = get_post_custom_values("thumbnail");

if (isset($value_img[0])) { ?>            

        <img src="<?php echo bloginfo('template_url'); ?>/thumb.php?src=<?php echo get_post_meta($post->ID, "thumbnail", $single = true); ?>&amp;h=300&amp;w=390&amp;zc=1&amp;q=95" alt="<?php the_title(); ?>" />

        <?php } ?>
         <div class="info" >

            <h2><a href="<?php the_permalink() ?>" ><?php the_title(); ?></a></h2>
            <?php the_excerpt(); ?>
         </div>
    </div>
<?php endwhile; ?>

</div>

2 个答案:

答案 0 :(得分:0)

可能是一个愚蠢的问题,但是,谷歌库调用中的所有空格实际上都存在于您的代码中吗? IE

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2    /jquery.min.js'></script>

我问,因为这不是对jQuery的有效引用所以如果有冲突并不重要,jQuery将不会被定义。

答案 1 :(得分:0)

似乎该主题的原始创建者在页脚中以笨拙的方式放弃了jQuery的旧版本。

删除让我的滑块开始工作。