wangxy
/
work-portal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

滚动公告

Browse Source
new-v20240713
dshclm 9 months ago
parent d20d6e2b18
commit 4096934411
1 changed files with 108 additions and 49 deletions
Show Stats Download Patch File Download Diff File

157
ruoyi-admin/src/main/resources/templates/home/base.html
Unescape View File

@ -399,54 +399,106 @@
color: #ffbb3f; color: #ffbb3f;
} }
.notice{ .notice{
width: 49%; width: 55%;
height: 40px; height: 40px;
border-radius: 8px; margin: 36px auto 14px;
border: 1px solid #eee;
margin: 36px auto 10px;
overflow: hidden; overflow: hidden;
float: left; font-weight: bold;
} }
.notice__inner{ .notice__inner{
height: 100%; animation: roll 36s linear infinite;
font-size: 14px; margin-top: 0
color: #333;
line-height: 40px;
white-space: nowrap;
position: relative;
} }
.notice__item{ .notice__item{
position: absolute; font-size: 38px;
top: 0; height: 40px;
left: 100%; line-height: 40px;
height: 100%; padding: 0 12px;
z-index: -1; white-space: nowrap;
} overflow: hidden;
.notice__item-first{ text-overflow: ellipsis;
padding-right: 70%;
animation: rollFirst 25s linear infinite;
}
.notice__item-second{
padding-right: 53%;
animation: rollSecond 25s linear 12s infinite;
}
@keyframes rollFirst {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-200%);
}
} }
@keyframes rollSecond { @keyframes roll {
0% { 0% {
transform: translateX(0); margin-top: 0;
} }
100% { 4% {
transform: translateX(-200%); margin-top: 0;
}
8% {
margin-top: 0;
}
12% {
margin-top: -40px;
}
16% {
margin-top: -40px;
}
20% {
margin-top: -80px;
}
24% {
margin-top: -80px;
}
28% {
margin-top: -120px;
}
32% {
margin-top: -120px;
}
36% {
margin-top: -160px;
}
40% {
margin-top: -160px;
}
44% {
margin-top: -200px;
}
48% {
margin-top: -200px;
}
52% {
margin-top: -240px;
}
56% {
margin-top: -240px;
}
60% {
margin-top: -200px;
}
64% {
margin-top: -200px;
}
68% {
margin-top: -160px;
}
72% {
margin-top: -160px;
}
76% {
margin-top: -120px;
}
80% {
margin-top: -120px;
}
84% {
margin-top: -80px;
}
88% {
margin-top: -80px;
}
92% {
margin-top: -40px;
}
96% {
margin-top: -40px;
}
100% {
margin-top: 0;
}
} }
} </style>
</style>
</head> </head>
<body class="layui-bg-gray" style=""> <body class="layui-bg-gray" style="">
<div id="content"> <div id="content">
@ -458,17 +510,24 @@
<div class="layui-container"> <div class="layui-container">
<div class="notice"> <div class="notice">
<div class="notice__inner"> <div class="notice__inner">
<i class="layui-icon layui-icon-speaker" style="font-size: 32px;background-color: white;height: 100%;display: inline-block;"></i> <div class="notice__item" th:each="notice,status : ${noticeList}">
<span class="notice__item notice__item-first"> <a style="color: #c70011" th:href="@{/public_view.html(type=1,id=${notice.noticeId})}" th:title="${notice.noticeTitle}" target="_blank" >[[${#strings.abbreviate(notice.noticeTitle,33)}]]</a>
[[${#strings.abbreviate(noticeList[0].noticeTitle,33)}]] </div>
【[[${#dates.format(noticeList[0].createTime, 'yyyy年MM月dd日')}]]】
</span>
<span class="notice__item notice__item-second">
[[${#strings.abbreviate(noticeList[1].noticeTitle,33)}]]
【[[${#dates.format(noticeList[1].createTime, 'yyyy年MM月dd日')}]]】
</span>
</div> </div>
</div> </div>
<!-- <div class="notice">-->
<!-- <div class="notice__inner">-->
<!-- <i class="layui-icon layui-icon-speaker" style="font-size: 32px;background-color: white;height: 100%;display: inline-block;"></i>-->
<!-- <span class="notice__item notice__item-first">-->
<!-- [[${#strings.abbreviate(noticeList[0].noticeTitle,33)}]]-->
<!-- 【[[${#dates.format(noticeList[0].createTime, 'yyyy年MM月dd日')}]]】-->
<!-- </span>-->
<!-- <span class="notice__item notice__item-second">-->
<!-- [[${#strings.abbreviate(noticeList[1].noticeTitle,33)}]]-->
<!-- 【[[${#dates.format(noticeList[1].createTime, 'yyyy年MM月dd日')}]]】-->
<!-- </span>-->
<!-- </div>-->
<!-- </div>-->
<div class="layui-row layui-col-space1"> <div class="layui-row layui-col-space1">
<div class="layui-col-md6"> <div class="layui-col-md6">
<div class="layui-carousel" id="ID-carousel-demo-image" style="width: 650px;height: 433px;"> <div class="layui-carousel" id="ID-carousel-demo-image" style="width: 650px;height: 433px;">

Write Preview
Loading…
Cancel
Save