动态加载: 你可以通过js动态添加像素盒子之后运行anlin.loadhd()函数来实现,例子如下:

<script>
$('body').append(`<div id="bgid" anlinbg="{'img':'/image/bg1.png'}"  style="background-size:100% auto;background-repeat:no-repeat;"></div>`);
anlin.loadhd('#bgid');</script>
 

调试内容,为了更方便的定位anlin属性,您可以开启调试来进行捕捉x和y的值
anlinbg="{...,debug:true}",开启内容位置调试,点击盒子内任意区域来显示x,y的位置
anlin="{...,debug:true}",开启内容调试,鼠标长按可进行拖拽获取x,y的值(不支持手机浏览器,请使用电脑测试)

<style>
.bgim{background-size:100% auto;background-repeat:no-repeat;}
body{max-width:800px;margin:0 auto;}
</style>
<!--点击盒子内任意区域来获取该位置x,y的值-->
<div id="ggrr" class="bgim" anlinbg="{img:'/image/bg1.png',debug:true}" style="overflow:hidden;">
<!--鼠标长按糖果移动位置获取x,y-->
<div id="eee" class="bgim" anlin="{x:1,y:1.01,w:100,h:100,lh:80,f:0,debug:true}" style="background-image:url(/image/tg.png);z-index:1;"></div>
</div>
修改输入框中的值来调试位置和长宽:<br>
<input type="text" id="ooo" value="" style="width:100%;height:39px;line-height:39px;" oninput="$('#eee').attr('anlin',$(this).val());anlin.loadhd('#ggrr');">
<script>
$("#ooo").val($("#eee").attr('anlin'));
</script>
 

如果你添加 .pre-scrollable 类, pre 元素最大的高度 max-height 为 350px ,并生成一个 Y 轴的滚动条:

在 pre 元素中的文本
	宽度的显示与文本的宽度一样,
	保留了  空  格 和

	换行。
	
	

QQ群

友情链接: 百度

鄂ICP备2021014629号-3

2022-11-17更新:已修复图片预览gif动图显示