如何在显示10-15个链接后添加“显示更多链接”而不是显示100-200个链接?我想只显示10-15的链接在开始,然后当有人点击显示其余的隐藏链接,以保存页面空间。
{if $listing_styles.links}
<div id="link_list" {if $listing_styles.embeds}style="display:none"{/if}>
{foreach from=$thisepisode.embeds key=id item=val name=titles}
<div class="span-16 inner-16 notopmargin embed-selector" style="background: #F1F2F1 url('{$embed_languages[$val.lang].flag}') 15px 17px no-repeat;" onclick="changeEmbed({$val.id},{$global_settings.countdown});">
<h5 class="left">
{$embed_languages[$val.lang].language}
{if $val.type} -
<a class="link" href="javascript:void(0);" {if $smarty.foreach.titles.first}class="current"{/if} id="selector{$val.id}"><span>{$val.type}</span></a>
{/if}
</h5>
<ul id="filter" style="width:200px;float:right;margin-top: 0px;">
{if $val.link}
{if $global_settings.adfly.id}
<li class="current" style="float:right">
<a href="http://**f.ly/{$global_settings.**fly.id}/{$val.link|replace:"http://":""}" target="_blank">{$lang.open_video}</a>
</li>
{else}
<li class="current" style="float:right">
<a href="{$val.link}" target="_blank">{$lang.open_video}</a>
</li>
{/if}
{/if}
</ul>
</div>
{/foreach}
</div>
{/if}
发布于 2015-04-13 17:53:41
看看这个插件。对于你想要做的事情来说,效果很好:
http://jedfoster.com/Readmore.js/
基于您的html,这里有一个小提琴显示这与readmore插件的工作。我刚刚将完整的readmore代码复制到小提琴中,但您可能希望将其添加为引用js文件( javascript中第8行的代码是插件代码)。
http://jsfiddle.net/6px7qso0/1/
基本上,在页面上下载并添加对readmore.js文件的引用(从我在评论中发布的链接中获取github的文件)。然后将以下代码添加到页面中。
{literal}
<script type="text/javascript">
jQuery(function(){
jQuery('#link_list').readmore({
speed: 75,
collapsedHeight: 400,
lessLink: '<a href="#">Read less</a>'
});
});
</script>
{/literal}
查看插件选项,以获得对插件的更多控制。
https://stackoverflow.com/questions/29617826
复制