vue实现点击按钮图片左右滚动

最新推荐文章于 2024-06-29 15:18:41 发布

原创

最新推荐文章于 2024-06-29 15:18:41 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #css3

本文介绍了如何使用Vue.js结合JavaScript和CSS3实现点击按钮后图片进行左右滚动的效果，包括HTML布局、Vue.js组件逻辑以及CSS样式设定。

1、HTML部分

<el-row :gutter="20">
    <el-col :xs="24" :sm="24" :md="24">
        <div class="jxIndexFrame">
            <span class="jxIndexTitle">荣誉资质</span>
            <div class="certificateModel">
                <el-col :xs="2" :sm="2" :md="1" class="text-right certificateArrow" style="margin-left: 5px">
                    <i class="el-icon-d-arrow-left" @click="prevCenterHonorCertificate"></i>
                </el-col>
                <el-col :xs="20" :sm="20" :md="22"