用jQuery替换文章编辑器里的图片样式及alt标签 实现自定义图片样式
使用迅睿cms建站如果是固定位置展示图片或者图片集,我们可以用迅睿cms的图集功能结合前端样式去实现。如果想把文章正文中的图片(通过编辑器上传的),设置指定样式。可以考虑使用本文方法,用 JQ 替换编辑器里的图片样式。
应用范围:
实现点击图片以灯箱显示原图效果等;
实现图片以指定样式显示等;
实现图片下方显示图片标题等;
...
示例代码:
以下为示例代码,根据实际应用,修改图片名称调用标签(我这里调用的是文章标题),修改样式标签等。
<script type='text/javascript'>
const pagesTitle = '{$title}';
// 重构img标签
$('article img').replaceWith(function () {
const imgSrc = $(this).attr('src');
return (
'<div class=""><img src="' + imgSrc + '" alt="' + pagesTitle + '" ><p class="">' + pagesTitle + '</p></div>'
);
});
</script>
免责声明:1.凡本站注明“来源:XXX(非老K模板网)”的作品,均转载自其它媒体,所载的文章、图片、音频视频文件等资料的版权归版权所有人所有,如有侵权,请联系laokcms#126.com处理;2.凡本站转载内容仅代表作者本人观点,与老K模板网无关。
相关文档
- pbootcms后台内容列表增加阅读量和点赞量自定义修改
- pbootcms模板文章列表没有缩略图时也不显示默认图片
- pbootcms标签分页中url会无限重复叠加的解决方案
- pbootcms模板修改tags实现keywords内容关联匹配
- pbootcms模板标签序数从2开始
- pbootcms面包屑导航样式修改和自定义的设置方法
- pbootcms模板文件如何调用网站所有的文章
- pbootcms模板文章列表序号调用标签
- pbootcms网站标签pboot:list当前文档高亮设置教程
- pbootcms编辑器过滤div代码解决办法
- Pbootcms字段为空调用另一个字段标签代码
- pbootcms列表如何置顶文章,istop不管用怎么办?
- pbootcms修改后台文章显示最大数量
- pbootcms基本调用标签大全
- pbootcms详情页常见标签调用
- pbootcms调用文章从第2条或者第N条开始
- pbootcms模板按照自定义字段搜索
- pbootcms模板发布文章显示的默认作者如何修改?
- pbootcms调用搜索页keyword值数量和标签页tag值和...
- pbootcms导航标签从第2个开始调用的方法
0 条评论