홈페이지를 만드는 사람들을 위한 안내서
탭형 최신글 위젯 만드는 방법
조회 수 8 추천 수 0 2022.10.07 02:06:15소스
widgets/content_extended/skins/default
HTML
<ul class="tab_module widgetTab">
{@$i=0}
<!--@foreach($widget_info->tab as $module_srl => $tab)-->
<li cond="$i<10" <!--@if($i==0)--> class="active"<!--@end--> ><!--@if($widget_info->tab_move_type=="click")--><a
href="javascript:"
onclick="content_widget_tab_show(jQuery(this),jQuery(this).parents('ul.tab_module').next('dl.widgetDivider'),{$i},1,'{$tab->url}')">
<!--@else--><a href="{$tab->url}"
onmouseover="content_widget_tab_show(jQuery(this),jQuery(this).parents('ul.tab_module').next('dl.widgetDivider'),{$i},0,0)">
<!--@end-->{$tab->title}</a></li>
{@$i++}
<!--@end-->
</ul>
<dl class="widgetDivider">
{@$i=0}
<!--@foreach($widget_info->tab as $module_srl => $tab)-->
<dt>{$tab->title}</dt>
<dd<!--@if($i==0)--> class="open"<!--@end--> >
{@$widget_info->content_items = $tab->content_items}
<!--#include("_tab_none.html")-->
</dd>
{@$i++}
<!--@end-->
</dl>
JS
function content_widget_tab_show(tab, list, i, ttype, url) {
tab.parents('ul.widgetTab').children('li.active').removeClass('active');
tab.parent('li').addClass('active');
jQuery('>dd', list).each(function (j) {
if (j == i) {
if (ttype == 1 && jQuery(this).hasClass('open')) {
location.href = url;
return;
}
jQuery(this).addClass('open');
} else jQuery(this).removeClass('open');
});
}
