Question

我是jquery的初学者，我正在尝试更改我的网站标题的颜色，具体取决于显示元标记的幻灯片。我理解通过jquery设置动态元素的样式我必须使用事件监听器，如果我只是使用＆＃39;点击＆＃39;或者＆＃39; mouseenter＆＃39;但我需要更改标题颜色，只需加载页面而无需等待用户点击或悬停。所以我尝试通过创建一个伪事件来做到这一点 -

    var e = jQuery.Event( "mouseover mouseout" );


    $(document).on('jQuery(document).trigger( e )', '.flex-active-slide', function(){
            $("li.slide-755.ms-image.flex-active-slide").closest("#pagewrap").find("#site-logo a").css('cssText', 'color: #0000ff!important');
    });

任何帮助解释的人都会非常感激，因为我是初学者。谢谢!!

Answer 1

每当动画结束时都会触发此回调，并将一个“myClass”类添加到滑块内的任何元素中，其类别为“flex-active-slide”

// Can also be used with $(document).ready()
$(window).load(function() {
  $('.flexslider').flexslider({
    animation: "slide",
    after: function(){alert("hello you can add your js here for each slide change")},
  });
});

<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/flexslider/2.7.0/flexslider.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.sstatic.net/Shared/stacks.css?v=596945d5421b">
<link rel="stylesheet" type="text/css" href="https://cdn.sstatic.net/Shared/stacks.css?v=596945d5421b">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flexslider/2.7.0/jquery.flexslider.min.js"></script>


<div class="flexslider">
  <ul class="slides">
    <li>
      <img src="http://via.placeholder.com/350x150" />
    </li>
    <li>
      <img src="http://via.placeholder.com/350x150" />
    </li>
    <li>
      <img src="http://via.placeholder.com/350x150" />
    </li>
    <li>
      <img src="http://via.placeholder.com/350x150" />
    </li>
  </ul>
</div>

Answer 2

使用下面的代码为我做了

{{1}}

这样每次加载页面时，我都会编辑css，而不是使用jquery事件监听器。

触发自定义事件以将jquery添加到由插件创建的动态元素中？

2 个答案: