115 lines
4.8 KiB
Plaintext
115 lines
4.8 KiB
Plaintext
<div class="w-annc w-annc widget-announcement-15" style="position:relative;">
|
||
<h3 class="w-annc__widget-title">
|
||
<span>{{widget-title}}</span>
|
||
</h3>
|
||
<div class="w-annc__more-wrap clearfix">
|
||
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多最新消息" : "More NEWS" %></a>
|
||
</div>
|
||
<div style="position: absolute;top: 50%;width:100%; z-index: 101;">
|
||
<div style="">
|
||
<button id="prev-{{subpart-id}}" class="btn-left" title = "<%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %>" style="float: left;height: 2.5em; width: 2.5em;border: 0;background-size: contain;position: absolute;transition:.3s; left: 0.6%;color: #ffffff;
|
||
background: rgba(0, 0, 0, 0.2);
|
||
border-radius: 50%;
|
||
border: none; z-index: 2;"><i class="fa fa-angle-left prev-button" aria-hidden="true" style="font-size: 1.5rem;"></i><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "上一張" : "prev" %></span></button>
|
||
<button id="next-{{subpart-id}}" class="btn-right" title = "<%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %>" style="float: right;;height: 2.5em; width: 2.5em;background-size: contain;border: 0;position: absolute;transition:.3s;right: 0.6%;color: #ffffff;
|
||
background: rgba(0, 0, 0, 0.2);
|
||
border-radius: 50%;
|
||
border: none; z-index: 2;"><i class="fa fa-angle-right next-button" aria-hidden="true" style="font-size: 1.5rem;"></i><span style="display: none;"><%= (I18n.locale.to_s =="zh_tw") ? "下一張" : "next" %></span></button>
|
||
</div>
|
||
</div>
|
||
<ul class="w-annc__list row cycle-slideshow" data-level="0" data-list="announcements" data-cycle-fx="carousel"
|
||
data-cycle-timeout="0"
|
||
data-cycle-carousel-visible="3"
|
||
data-cycle-carousel-fluid="true"
|
||
data-cycle-next="#next-{{subpart-id}}"
|
||
data-cycle-prev="#prev-{{subpart-id}}"
|
||
data-cycle-slides=".w-annc__item" >
|
||
<li class="w-annc__item " >
|
||
<div class="w-annc__item_inner">
|
||
<a href="{{link_to_show}}" class="widget-title-a">
|
||
<div class="w-annc__img-wrap bullseye" style="position:relative">
|
||
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
||
<div class="transitionfade"></div>
|
||
</div>
|
||
<div class="w-annc__content-wrap">
|
||
<div class="w-annc__meta">
|
||
<span class="w-annc__status-wrap" data-list="statuses" data-level="1">
|
||
<span class="w-annc__status label {{status-class}}">{{status}}</span>
|
||
</span>
|
||
<span class="w-annc__postdate-wrap" date-format="%Y-%m-%d">
|
||
<i class="fa-regular fa-calendar"></i>
|
||
<span class="w-annc__postdate">{{postdate}}</span>
|
||
</span>
|
||
<span class="w-annc__category-wrap">
|
||
<i class="fa-solid fa-list"></i>
|
||
<span class="w-annc__category">{{category}}</span>
|
||
</span>
|
||
</div>
|
||
<h4 class="w-annc__entry-title">
|
||
<span class="w-annc__title">{{title}}</span>
|
||
</h4>
|
||
<p class="w-annc__subtitle">{{subtitle}}</p>
|
||
</div>
|
||
</a>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<style type="text/css">
|
||
.w-annc__item_inner{
|
||
cursor: pointer;
|
||
}
|
||
.widget-title-a {
|
||
display: block;
|
||
}
|
||
[data-subpart-id="{{subpart-id}}"] .bullseye{
|
||
overflow: hidden;
|
||
}
|
||
</style>
|
||
<script>
|
||
$(document).ready(function(){
|
||
var $widget = $('[data-subpart-id=\"{{subpart-id}}\"]');
|
||
|
||
// nav_tabs_filter 切換後，對當前顯示的 ul 初始化 cycle2
|
||
function initCycle_{{subpart-id}}($ul){
|
||
if(!$ul || $ul.length === 0) return;
|
||
if($ul.data('cycle.opts')) return; // 已初始化過就跳過
|
||
|
||
$ul.addClass('cycle-slideshow')
|
||
.attr('data-cycle-fx', 'carousel')
|
||
.attr('data-cycle-timeout', '0')
|
||
.attr('data-cycle-carousel-visible', '3')
|
||
.attr('data-cycle-carousel-fluid', 'true')
|
||
.attr('data-cycle-next', '#next-{{subpart-id}}')
|
||
.attr('data-cycle-prev', '#prev-{{subpart-id}}')
|
||
.attr('data-cycle-slides', '.w-annc__item')
|
||
.cycle();
|
||
}
|
||
|
||
// 偵測是否有 nav_tabs_filter
|
||
var hasNavTabsFilter = $widget.find('.nav_tabs_filter').length > 0;
|
||
|
||
if(hasNavTabsFilter){
|
||
// 初始化第一個顯示的 ul
|
||
var $activeUl = $widget.find('[data-category]:not([style*="display: none"]) ul.w-annc__list').first();
|
||
initCycle_{{subpart-id}}($activeUl);
|
||
|
||
// 頁籤切換時重新初始化對應的 ul
|
||
$widget.find('.filter_tab').on('click', function(){
|
||
var category = $(this).data('category');
|
||
setTimeout(function(){
|
||
var $ul = $widget.find('[data-category="' + category + '"] ul.w-annc__list').first();
|
||
initCycle_{{subpart-id}}($ul);
|
||
}, 100);
|
||
});
|
||
} else {
|
||
// 沒有 nav_tabs_filter，直接初始化
|
||
var $ul = $widget.find('ul.w-annc__list').first();
|
||
initCycle_{{subpart-id}}($ul);
|
||
}
|
||
});
|
||
</script>
|
||
|
||
|
||
|