<div class="new-nav flex">
    <a href="http://ozzgyyj2.s8.myxypt.com/news/gsxw51b/" class="item">公司动态</a>
    <a href="http://ozzgyyj2.s8.myxypt.com/news/xyzx2ba/" class="item">行业资讯</a>
    <a href="http://ozzgyyj2.s8.myxypt.com/news/jszx98d/" class="item">技术资讯</a> 
</div>

<div class="news-swiper" style="overflow: hidden;">
    <div class="swiper-wrapper">
        <div class="swiper-slide"><img src="https://cdn.myxypt.com/6235a976/25/11/632cd777f5fe035c05458e4bd913912c738d3789.jpg" alt=""></div>
        <div class="swiper-slide"><img src="https://cdn.myxypt.com/6235a976/25/11/632cd777f5fe035c05458e4bd913912c738d3789.jpg" alt=""></div>
        <div class="swiper-slide"><img src="https://cdn.myxypt.com/6235a976/25/11/632cd777f5fe035c05458e4bd913912c738d3789.jpg" alt=""></div>
    </div>
</div>


<script>
    $(function() {

        var w = window.innerWidth; // 屏幕宽度

        var swiper = new Swiper('#news .news-swiper', {
            runCallbacksOnInit: false, //初始化时执行slideChangeTransitionStart回调
            speed: 1200, // 切换速度
            spaceBetween: 50, //间距
            allowTouchMove: w <= 1024, // 允许触摸滑动

        });

        // 鼠标进入事件
        $(".new-nav .item").on("mouseenter", function() {

            var self = $(this); // 当前元素

            self.addClass('on').siblings().removeClass('on'); // 切换选中状态

            var slideIndex = $(this).index(); // 当前索引位置

            swiper.slideTo(slideIndex, 800, false); // 切换到对应索引的slide

        }).eq(0).mouseenter();; // 默认选中第一个元素

    });
</script>