欢迎来到六久阁织梦模板网!
织梦图集图片集标签调用图片+数字编号自增+第一个高亮+自定义limit

织梦图集图片集标签调用图片+数字编号自增+第一个高亮+自定义limit

浏览次数: 0

作者: 六久阁织梦模板网

信息来源: 六久阁

更新日期: 2019-06-01

文章简介

效果图: 前端代码: divclass=jqzoomid=spec-n1imgsrc=/images/1.jpg/divdivid=spec-n5divid=spec-listulclass=list-hliid=img0onmouseover=thisimg(0)class=currentimgalt=产品注释1src=/images/1.jpg/liliid=img1onmouseover=thisimg(1)imgalt=产品注释2s

  • 正文开始
  • 相关文章

效果图:

织梦图集图片集标签调用图片+数字编号自增+第一个高亮+自定义limit

前端代码:

<div class="jqzoom" id="spec-n1"><img src="/images/1.jpg"></div><div id="spec-n5">
	<div id="spec-list">
		<ul class="list-h">
			<li id="img0" onmouseover="thisimg(0)" class="current"><img alt="产品注释1" src="/images/1.jpg"></li>
			<li id="img1" onmouseover="thisimg(1)"><img alt="产品注释2" src="/images/2.jpg"></li>
			<li id="img2" onmouseover="thisimg(2)"><img alt="产品注释3" src="/images/3.jpg"></li>
			<li id="img3" onmouseover="thisimg(3)"><img alt="产品注释4" src="/images/4.jpg"></li>
			<li id="img4" onmouseover="thisimg(4)"><img alt="产品注释5" src="/images/5.jpg"></li>
		</ul>
	</div></div>

1、从上面前端代码我们可以看到默认显示图片集第1个图片,我们可以用{dede:field name=imgurls row=1}{/dede:field}

图集选项-表现方式,选择幻灯片样式,不然上面的 {dede:field name=imgurls row=1} 无效

织梦图集图片集标签调用图片+数字编号自增+第一个高亮+自定义limit

2、下面的小图每个li里面都有不同的自增id和自增thisimg,而且第一个有高亮的class="current",所以要先让织梦程序的图集标签能输出自增数字 0 1 2 3 ...

打开 /include/taglib/productimagelist.lib.php 文件 找到

$ctp->LoadSource($innerText);


在它下面加入

$GLOBALS['autoindex'] = 0;


继续找到

$revalue .= $ctp->GetResult();

在它下面加入

$GLOBALS['autoindex']++;


修改完成后,上面的模板前端代码就这样写标签嵌套了

<div class="jqzoom" id="spec-n1"><img src="{dede:field name=imgurls alt=图片输出区 row=1}
[field:imgsrc/]{/dede:field}"></div>
<div id="spec-n5">
<div id="spec-list">
<ul class="list-h">
{dede:productimagelist}
<li id="img[field:global name=autoindex/]" onmouseover="thisimg([field:global name=autoindex/])"
[field:global name=autoindex runphp=yes](@me==0)? @me=' class="current"':@me='';[/field:global]><img alt="[field:text/]" src="[field:imgsrc/]"></li>
{/dede:productimagelist}
</ul>
</div>
</div>

自定义limit指定几个、偏移几个

要使用limit自定义输出偏移的图集图片,必须要参考上面的第2步加入$GLOBALS['autoindex']

然后继续在 /include/taglib/productimagelist.lib.php 文件 找到

$attlist="desclen|80";

改成

$attlist="desclen|80,limit|";

如图:

image.png

继续找到

foreach($images as $row)

在它的前面加入

$limit = trim(preg_replace('#limit#is','',$limit));
if($limit!='')
{
if(preg_match('#,#', $limit))
{
$limitarr = explode(",", $limit);
$lmt = $limitarr[0];
$num = $limitarr[1];
}
else
{
$lmt = 0;
$num = $limit;
}
$images = array_slice($images,$lmt);
}


继续找到

foreach($ctp->CTags as $tagid=>$ctag)

在它上面加入

if($limit!='' && $GLOBALS['autoindex'] == $num) break;

如图:

image.png

图集内容页模板标签写法

默认全部

{dede:productimagelist}

[field:imgsrc/]<br />

{/dede:productimagelist}



指定几个

{dede:productimagelist limit=2}

[field:imgsrc/]<br />

{/dede:productimagelist}


偏移几个

{dede:productimagelist limit=1,4}

[field:imgsrc/]<br />

{/dede:productimagelist}


显示效果如图

image.png

插件下载说明

未提供下载提取码的插件,都是站长辛苦开发,需收取费用!想免费获取辛苦开发插件的请绕道!

织梦二次开发QQ群

本站客服QQ号:3149518909(点击左边QQ号交流),群号(383578617) DedeCMS织梦教程QQ群 如果您有任何织梦问题,请把问题发到群里,阁主将为您写解决教程!

转载请注明: 织梦模板 » 织梦图集图片集标签调用图片+数字编号自增+第一个高亮+自定义limit

  • 织梦模板如何在{dede:sql}中使用自增函数[field:global.autoindex/]
    阅读
    在{dede:arclist/}这个标签中大家都知道有个[field:global.autoindex/],这个变量每生成一行就+1,那很多人希望{dede:sql/}标签也需要加上这个功能,怎么实现这个功能呢? 下面我们就开始增加这个小扩展,我们知道在V5.3中织梦的标签已经分离出来,也就是类...
  • 织梦图集模型和软件模型编辑器功能不完整的解决方法
    阅读
    织梦图集和软件里的编辑器 织梦其他模型编辑器 织梦图集模型编辑器功能不完整的解决方法 打开 /dede(后台目录)/templets/album_add.htm 和 /dede(后台目录)/templets/album_edit.htm 找到 Diy 改成 Basic 织梦软件模型编辑器功能不完整的解决方法 打开 /dede...
  • 织梦图集标签调用图片+数字编号自增+第一个高亮
    阅读
    织梦图集标签调用图片+数字编号自增+第一个高亮前台效果: 前端代码 div class=jqzoom id=spec-n1img src=/images/1.jpg/div div id=spec-n5 div id=spec-list ul class=list-h li id=img0 onmouseover=thisimg(0) class=currentimg alt=产品注释1 src=/image...
  • 织梦为自定义模型增加图集功能
    阅读
    当我们需要在前端输出图片+对应的图片注释描述时,需要用到图集功能;当我们自定义模型或者商品模型、软件模型需要也要用到图片+注释描述时,也需要用到图集功能。 备份你后台目录以下4个文件 dede/archives_add.php dede/archives_edit.php dede/templets/a...
  • 织梦为文章模型增加图集功能
    阅读
    织梦为文章模型增加图集功能完成后效果图: 当我们需要在前端输出图片+对应的图片注释描述时,需要用到图集功能;当我们自定义模型或者商品模型、软件模型需要也要用到图片+注释描述时,也需要用到图集功能。 备份你后台目录以下4个文件 \dede\article_add.p...
  • 织梦图集局部放大镜jquery特效
    阅读
    这是比较流行的一种图集展示效果,适合绝大多数的内容展示,把这个效果的代码做到最简单。美观漂亮的JQuery,并没有固定图片尺寸比例(很多是正方形的),能比较自由控制展示效果。 图集展示放大镜、底部左右滚动JQuery 结合dedecms内容管理系统,需要运用频...
  • 织梦如何获取图集调用第一张图片完美解决方法
    阅读
    制作织梦产品图集多图效果的时候,常常需要获取图集第一张图片的功能,假设获取的是缩略图,那么缩略图不够大的情况下,第一展示效果就会很差,下面来介绍下如何获取调用织梦图集第一张图片的方法: 首先在 include 文件夹最下面的 extend.func.php 后面添加...
  • 织梦自增变量autoindex标签的使用方法
    阅读
    例1: {dede:arclist titlelen=120 row=8 typeid=2} li class=li[field:global.autoindex/]a href=[field:arcurl /] title=[field:title/] target=_blank [field:title function=cn_substr(@me,10)/]/a/li {/dede:arclist} 例2: {dede:arclist row=6 titlel...
  • 织梦图片集图集内容不能自动内链的解决方法
    阅读
    由于织梦内容模型只有图片集模型添加文档不能自动获取关键字,所以前台内容页在内链条件中,如果文档没有关键字就无法自动内链,这个逻辑处理官方已经不再使用了,织梦更新时遗漏的处理,我们来修正它 打开 /include/arc.archives.class.php 找到 (大概在231...
  • 织梦图集在首页、列表页、内容页调用图集所有图片及注释的方法
    阅读
    我们都知道织梦的图集默认调用语法是:{dede:field name=imgurls src=/uploads/allimg/180903/1-1PZ3150P70-L.jpg/ 今天,就教大家如何在织梦的图集中调用当前文档的所有图片及注释。 打开/include/common.func.php,在最后面加上以下代码: //循环输出图集...
收藏此文 打赏本站

如本文对您有帮助,就请六久阁织梦模板网抽根烟吧!

  • 支付宝打赏
    支付宝扫描打赏
    微信打赏
    微信扫描打赏
织梦调用同级栏目功能及当前文章显示高亮
« 上一篇 2019年05月22日
织梦后台左侧菜单空白不显示的解决办法
下一篇 » 2019年05月22日

精彩评论

有问题在这里提问,阁主会为你解决!
  • 全部评论(0
    还没有评论,快来抢沙发吧!
推荐精品模板更多
重型机械设备响应式织梦模板
更新时间:2017-08-10

人已经看过了!

漂亮清爽的织梦会员中心模板带推广邀请发布文章
更新时间:2017-10-24

人已经看过了!

矿山机械设备企业织梦模板 响应式网站
更新时间:2017-08-10

人已经看过了!

木质地板-家具橱柜织梦模板 带手机版
更新时间:2017-08-10

人已经看过了!

高端大气装修装饰公司营销官网(带手机端带筛选)
更新时间:2017-11-01

人已经看过了!

网页模板/视频素材/图片分享/源码商城站长交易平台
更新时间:2017-08-10

人已经看过了!

资源文章分享响应式整站源码带测试数据
更新时间:2017-08-10

人已经看过了!