jquery i5scroll实现文字文本无缝滚动效果代码-html代码-BFW代码库

jquery i5scroll实现文字文本无缝滚动效果代码

代码语言：html

代码描述：jquery i5scroll实现文字文本无缝滚动效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <style>
        * {
            margin: 0;
            padding: 0;
        }

        li {
            list-style: none;
        }

        .i35-wrap {
            margin: 50px auto 0;
            width: 360px;
            vertical-align: top;
            border: 1px solid rgb(219, 219, 219);
            box-shadow: rgb(164, 160, 157) 1px 1px 9px -3px;
            background-color: #F5F5F5;
        }

        .i35-title {
            display: flex;
            border-bottom: 2px solid rgb(99, 65, 165);
            height: 60px;
            line-height: 40px;
        }

        .i35-title li {
            text-align: center;
            flex: 1 1 1px;
            cursor: pointer;
            padding: 10px 30px;
            color: rgb(51, 51, 51);
        }

        .i35-title li.active {
            color: #fff;
            background-color: rgb(99, 65, 165);
        }

        .i35-con {
            padding: 20px;
        }

        .i35-con .content {
            display: none;
            padding: 20px;
            background-color: #fff;
        }

        .i35-con .content li {
            font-size: 12px;
            height: 30px;
            line-height: 30px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    </style>
</head>

<body>
    <div class="i35-wrap">
        <ul class="i35-title">
            <li class="active">布丽吉塔</li>
            <li>秩序之光</li>
        </ul>
        <div class="i35-con">
            &.........完整代码请登录后点击上方下载按钮下载查看