简易应用市场 2.0.5 - 创意电子

本扩展只限简易应用2.0版本以上用户使用。

安装扩展之后，还需要进行以下操作：

登录DZ后台----》工具----》DIY 模块分类缓存（打勾）---》确定（等待提示全部缓存更新完毕,否则DIY无法使用）

进入门户---》模块模板---》添加---》模块分类选择（简易应用模块）提交，然后输入以下代码：

模板名称：简易应用列表(随便取名)

内容填写：（注：模板可以自己设计，这里提供一个样例，请根据自己的需求，自己修改样式）

===================代码分割线=======================
<style type="text/css">
.recommend h2{color:#55adff; font-size:14px; font-weight:bold; text-indent:8px;}
.recommend .leftIcon{width:27px; height:28px; position:absolute; left:5px; top:38px; background:url(source/plugin/mini_app/images/icon.png) 0 -28px no-repeat; z-index:3;}
.recommend .rightIcon{width:27px; height:27px; position:absolute; right:5px; top:38px; background:url(source/plugin/mini_app/images/icon.png) 0 0 no-repeat; z-index:3;}
.scrollimg {position:relative;height:115px;overflow:hidden;}
.scrollimg-con {left:40px;position:absolute;width:880px;margin:0 auto;overflow:hidden;}
.scrollimg-list {height:95px; margin-top:15px;zoom:1; padding:0 0px; }
.scrollimg-list li {width:88px; float:left; display:inline; margin:auto; padding:0 0px; line-height:24px; overflow:hidden; text-align:center;}
.scrollimg-list li a {color:#535353;margin:auto;text-align:center;}
.scrollimg-list li a.pic {width:64px; height:65px; background:url(source/plugin/mini_app/images/imgbg.png) 0 0 no-repeat; display:block; overflow:hidden;}
.scrollimg-list li a.pic:hover {background:url(source/plugin/mini_app/images/hoverbg.png) 0 0 no-repeat;}
.scrollimg-list li a.pic img {margin:6px auto; left:0; top:0; display:block; overflow:hidden; width:52px; height:52px;}
_width:22px; _height:23px; _float:left; _margin-top:40px;_margin-right:-5px; _background:0 0 no-repeat;}
</style>
<script type="text/javascript">
var Class = {
create:function(){
return function(){
this.initialize.apply(this,arguments);
};
}
}
var HScrollMover = Class.create();
HScrollMover.getInstance = function(id){
if(this._instanceMap == null){
this._instanceMap = new Object();
}
for(var p in this._instanceMap){
if(id == p){
return this._instanceMap[p];
}
}
this._instanceMap[id] = new HScrollMover(id);
return this._instanceMap[id];
}
HScrollMover.prototype = {
initialize:function(id){
this.id = id;
this.moveOneTimer = 0;
this.movingTimer = 0;
this.moverNum = 8;
},
moveOne:function(direction,speed){
var id = this.id;
if(HScrollMover.getInstance(id).moveOneTimer != 0){
return;
}
if(!speed){
speed = 1;
}
var moveTimes = document.getElementById(id).offsetWidth/(speed*this.moverNum);
var tempMoveTimes = moveTimes;
var tempMoverNum = this.moverNum;
HScrollMover.getInstance(id).moveOneTimer = setInterval(function(){
moveTimes--;
var container = document.getElementById(id);
if(direction == "left"){
if(container.scrollLeft == container.scrollWidth - container.offsetWidth){
if (moveTimes == tempMoveTimes - 1) {
container.scrollLeft = 0;
}
moveTimes = 0;
} else {
container.scrollLeft += speed;
}
}else{
if(container.scrollLeft == 0){
container.scrollLeft = container.scrollWidth - speed*moveTimes;
moveTimes = 0;
} else if(container.scrollLeft < speed*moveTimes){
container.scrollLeft = 0;
moveTimes = 0;
} else {
container.scrollLeft -= speed;
}
}
if(moveTimes <= 0){
if(HScrollMover.getInstance(id).moveOneTimer != 0){
clearInterval(HScrollMover.getInstance(id).moveOneTimer);
HScrollMover.getInstance(id).moveOneTimer = 0;
}
}
},62);
}
}
var intervalId = 0;
function clickRightScloll(){
if (document.all) {
document.getElementById('rightScrollBtn').click();
} else {
var evt = document.createEvent('HTMLEvents');
evt.initEvent('click',true,true);
element = document.getElementById('rightScrollBtn');
element.dispatchEvent(evt);
}
}
function autoScroll() {
if (document.getElementById("rightScrollBtn").className == 'rightIcon') {
intervalId = setInterval("clickRightScloll()",3*1000);
document.getElementById("scrollContainer").onmouseover = function(){
if(intervalId != 0){
clearInterval(intervalId);
intervalId = 0;
}
}
document.getElementById("scrollContainer").onmouseout = function(){
if(intervalId != 0){
clearInterval(intervalId);
}
intervalId = setInterval("clickRightScloll()",3*1000);
}
}
}
</script>
<div class="recommend">
<div id="scrollContainer" class="scrollimg">
<div id="hContainer" class="scrollimg-con">
<div id="hContainerMask">
<ul id="scrollList" class="scrollimg-list">
[loop]
<li><span><a href="plugin.php?id=mini_app:index&mod=view&sid={id}" {target} class="pic" ><img class="png" src="{pic}" alt="{title}" /></a><p><a href="plugin.php?id=mini_app:index&mod=view&sid={id}" {target}>{title}</a></p></span></li>
[/loop]
<script type="text/javascript">
document.getElementById("hContainerMask").style.width = (20*44*2)+"px";
</script>
</ul>
</div>
</div>
<a href="#" class="leftIcon" id="leftScrollBtn" ></a>
<a href="#" class="rightIcon" id="rightScrollBtn" ></a>
</div>
</div>
<script language="javascript">
document.getElementById("leftScrollBtn").onclick = function(){
HScrollMover.getInstance('hContainer').moveOne('right',44);
return false;
};
document.getElementById("rightScrollBtn").onclick = function(){
HScrollMover.getInstance('hContainer').moveOne('left',44);
return false;
};
</script>
===================分割线=======================

复制代码

资源名称:
下载次数:0 文件大小: 记录
购买VIP 充值创意币运营教程免费赚创意币

安全检测,请放心下载