This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0
wcui/js/lib/sliders/main.htm

65 lines
2.8 KiB
HTML
Raw Normal View History

<div class="do-sliders" :class="{{skin}}">
2017-09-30 15:05:13 +08:00
12
<div class="slider-content" :class="{'h-100': !preview}" :class="{'h-80': preview}" :if="sliderList.length" :mouseenter="$stopSlide()" :mouseleave="$startSlide()">
<a class="do-ui-font slider-btn" href="javascript:;"
:click="$go(-1)">&#xe8ed</a>
<div class="container">
<div class="box"
:if="sliderType == 1"
:css="{width: sliderList.length * 100 + '%', transform: animation}">
<a target="_blank"
:repeat="sliderList"
:css="{width: currWidth}"
:attr="{href: el.link || 'javascript:;'}">
<img :if="el.src && el.src != ''" :attr-src="el.src">
<div class="default-elm" :class="{elm: !el.elm && !el.src, 'preview-act': curr === $index || (curr >= maxNum && $index == maxNum - 1)}" :if="!el.src" :html="el.elm ? el.elm : ''"></div>
<p :if="el.title"
:html="el.title"
class="title-class"></p>
</a>
</div>
<div class="box"
:if="sliderType == 2">
<a target="_blank"
class="fadeType"
:repeat="sliderList"
:css="{opacity: curr != $index ? 0 : 1}"
:attr="{href: el.link || 'javascript:;'}">
<img :if="el.src && el.src != ''" :attr-src="el.src">
<div class="default-elm" :class="{elm: !el.elm && !el.src, 'preview-act': curr === $index || (curr >= maxNum && $index == maxNum - 1)}" :if="!el.src" :html="el.elm ? el.elm : ''"></div>
<p :if="el.title"
:html="el.title"
class="title-class"></p>
</a>
</div>
2017-09-17 18:49:58 +08:00
</div>
<a class="do-ui-font slider-btn" href="javascript:;"
:click="$go(1)">&#xe8eb</a>
2017-09-17 18:49:58 +08:00
</div>
<div class="slider-preview-btn"
:css="{bottom: preview ? '-5%' : '15%'}" >
2017-09-17 18:49:58 +08:00
<span :if="!preview"
href="javascript:;"
:class="{'no-preview-act': curr === $index}"
:repeat="sliderList"
:click="$jump($index)">
</span>
2017-09-17 18:49:58 +08:00
<a class="btn-img" href="javascript:;"
:if="preview"
:class="{act: curr === $index || (curr >= maxNum && $index == maxNum - 1)}"
:click="$jump($index)"
:repeat="sliderBtnList">
<img
:class="{'preview-act': curr === $index || (curr >= maxNum && $index == maxNum - 1)}"
:if="el.src && el.src != ''"
2017-09-17 18:49:58 +08:00
:attr-src="el.src" />
<div class="btn-background"></div>
2017-09-17 18:49:58 +08:00
</a>
</div>
2017-09-30 15:01:15 +08:00
</div>