使用插件快速完成banner图及细节总结

最新推荐文章于 2024-08-15 10:22:00 发布

wenlong_date

最新推荐文章于 2024-08-15 10:22:00 发布

阅读量1.8k

点赞数

分类专栏： jquery 文章标签： superslide banner图

本文链接：https://blog.csdn.net/NtosKiking/article/details/52565556

版权

本文介绍了如何使用Superslide插件轻松创建轮播图，包括无需设置父级高度、图片容器固定宽高并隐藏溢出、图片居中显示等技巧。通过设置hd宽度、text-align和display属性，实现轮播图的灵活布局。

摘要由CSDN通过智能技术生成

这里使用的插件是superslide插件,能快速完成轮播图的切换以及很多功能，看起来比较方便
常见的banner图格式

<!DOCTYPE html>
<html lang="en">
<head>
<!-- 710 355 -->
<!-- 固定位置的banner图 -->
<!-- hd 里面的li 最好设置一个背景 因为是transparent的话就会在IE8中hover不到 -->
    <meta charset="UTF-8">
    <title>superslide第一种</title>
    <script type="text/javascript" src="jquery.min.js"></script>
    <script type="text/javascript" src="superSlide2.1/jquery.SuperSlide.2.1.1.js"></script>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/slide1.css">
</head>
<body>
    <div id="slide1">
        <div class="hd slide1_hd">
            <ul>
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>
        <div<