在DZ模板制作过程中,很多版块都是通过DIY功能来调用版块数据的,但由于版块的尺寸有限,我们要在一个版块下调用更多的数据,我们可以使用逐条显示调用的效果。
也就是在一个固定的区域中,通过逐条滚动的方式展示版块的数据,这样可以调用出更多的数据内容。
我们在自己制作DZ模板时,可以使用DZ论坛的DIY功能去实现这种效果。结合自己的代码与DIY功能可以实现逐条显示调用版块数据,代码如下:
<div class=”deanwenzhang”>
<ul>[loop]
<li>
<div class=”deanwzl”><a href=”{url}” target=”_blank”><img src=”{pic}” width=”{picwidth}” height=”{picheight}” /></a></div>
<div class=”deanwzm”><a href=”home.php?mod=space&{authorid}=1&do=profile” target=”_blank”><img src=”{avatar}” /></a></div>
<div class=”deanwzr”>
<div class=”deanyonghuname”><a href=”home.php?mod=space&{authorid}=1&do=profile” target=”_blank”>{author}</a></div>
<p><span class=”deanup”></span><span>{summary}</span><span class=”deandown”></span></p>
<div class=”deandate”>{dateline}</div>
</div>
<div class=”clear”></div>
</li>
[/loop]</ul>
</div>
<ul>[loop]
<li>
<div class=”deanwzl”><a href=”{url}” target=”_blank”><img src=”{pic}” width=”{picwidth}” height=”{picheight}” /></a></div>
<div class=”deanwzm”><a href=”home.php?mod=space&{authorid}=1&do=profile” target=”_blank”><img src=”{avatar}” /></a></div>
<div class=”deanwzr”>
<div class=”deanyonghuname”><a href=”home.php?mod=space&{authorid}=1&do=profile” target=”_blank”>{author}</a></div>
<p><span class=”deanup”></span><span>{summary}</span><span class=”deandown”></span></p>
<div class=”deandate”>{dateline}</div>
</div>
<div class=”clear”></div>
</li>
[/loop]</ul>
</div>
除了HTML代码之外,我们还需要加一段JS特效代码来实现逐条显示的效果。
[代码]js代码:
<script type=”text/JAVAscript”>
jq(function(){var scrtime;jq(“.deanwenzhang”).hover(function(){clearInterval(scrtime);},
function(){scrtime = setInterval(function(){var jqul = jq(“.deanwenzhang ul”);var liHeight = jqul.find(“li:last”).height();jqul.animate({marginTop : liHeight + 11+ “px”},1000,function(){jqul.find(“li:last”).prependTo(jqul)jqul.find(“li:first”).hide();jqul.css({marginTop:0});jqul.find(“li:first”).fadeIn(1000);});},5000);}).trigger(“mouseleave”);});
</script>
jq(function(){var scrtime;jq(“.deanwenzhang”).hover(function(){clearInterval(scrtime);},
function(){scrtime = setInterval(function(){var jqul = jq(“.deanwenzhang ul”);var liHeight = jqul.find(“li:last”).height();jqul.animate({marginTop : liHeight + 11+ “px”},1000,function(){jqul.find(“li:last”).prependTo(jqul)jqul.find(“li:first”).hide();jqul.css({marginTop:0});jqul.find(“li:first”).fadeIn(1000);});},5000);}).trigger(“mouseleave”);});
</script>
通过这样的代码组合,我们就可以通过DIY功能去在某个版块逐条调用版块数据了。
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END
喜欢就支持一下吧
相关推荐
评论 抢沙发
欢迎您留下宝贵的见解!
随即推荐
WordPress主题–WooCommerce商店主题 WoodMart v8.3.6 破解版下载
Woodmart 是一款WooCommerce商店主题,同时兼容Elementor页面编辑器插件。 主题文件在WoodMart Theme目录,核心插件在Plugins目录,汉化在Translation Files目录 主题说明 1.先安装WooCommerce...
浩哥手机后期修图秘籍熟悉修图技巧价值499
其实,无论是用手机修图还是用电脑修图,目的都一样,都是对照片进行艺术加工,让照片变得更好。我个人更喜欢用手机修图,因为手机不仅便于携带,手机修图APP还更加容易上手。所以我觉得手机修...
周易六十四卦之苗氏占卜术电脑绿化版
发现身边有好多朋友都有选择困难综合征,在做事情时总是犹犹豫豫,犹豫不定,包括我自己也经常会出现以上情况,于是灵机一动,想着古人都是借助国学“风水学说”占卜术来决定事情的进与退,所以...
(自适应手机端)新闻资讯网站模板 个人博客网站源码下载 – 带评论
(自适应手机端)新闻资讯网站模板 个人博客网站源码下载 – 带评论功能 PbootCMS内核开发的网站模板,该模板适用于新闻资讯网站、个人博客网站等企业,当然其他行业也可以做,只需要把文字...
抖音AI图文短视频带货全流程包含选品思路
今天给大家带来的项目是抖音图文带货。 随着AI的不断发展进步,现在做项目也越来越简单,原来需要请模特才能做的项目。 现在只需要一个指令就可以生成。 今天不仅给大家带来了几个案例的全流程...
安卓极光下载V1.0.4一款全能磁力下载工具
极光下载是一款全能磁力下载工具,采用智能极速引擎技术,内置全球实时更新的Tracker列表,实现下载连接命中率最大化与自动加速。支持多文件任务中自由选择下载或跳过文件,还具备下载中视频实...
























暂无评论内容