在ECSHOP增加限时抢购(促销商品)倒计时效果

看到不少朋友在找限时抢购(促销商品)倒计时效果,如下图类似京东的那种效果:

1、首先修改程序部分

打开includes/lib_goods.php

找到get_promote_goods()函数部分

$goods[$idx]['url'] = build_uri(‘goods’, array(‘gid’ => $row['goods_id']), $row['goods_name']);

(注:这里一定要谨慎,一定要找准位置,很多同志都是绊倒在这里的,如果你没修改过这个文件的话,大概是在396行的位置,找错了就出不来了)

下面增加代码

/* 促销时间倒计时 */

 

$time = gmtime();
if ($time >= $row['promote_start_date'] && $time <= $row['promote_end_date'])
{
$goods[$idx]['gmt_end_time'] = local_date(‘M d, Y H:i:s’,$row['promote_end_date']);
}
else
{
$goods[$idx]['gmt_end_time'] = 0;
}

 

2、然后可以新建一个 library/xianshi.lbi,将下面的代码粘贴进去:

 

<!– {if $promotion_goods} –>
<script >
var Tday = new Array();
var daysms = 24 * 60 * 60 * 1000
var hoursms = 60 * 60 * 1000
var Secondms = 60 * 1000
var microsecond = 1000
var DifferHour = -1
var DifferMinute = -1
var DifferSecond = -1
function clock(key)
{
var time = new Date()
var hour = time.getHours()
var minute = time.getMinutes()
var second = time.getSeconds()
var timevalue = “”+((hour > 12) ? hour-12:hour)
timevalue +=((minute < 10) ? “:0″:”:”)+minute
timevalue +=((second < 10) ? “:0″:”:”)+second
timevalue +=((hour >12 ) ? ” PM”:” AM”)
var convertHour = DifferHour
var convertMinute = DifferMinute
var convertSecond = DifferSecond
var Diffms = Tday[key].getTime() – time.getTime()
DifferHour = Math.floor(Diffms / daysms)
Diffms -= DifferHour * daysms
DifferMinute = Math.floor(Diffms / hoursms)
Diffms -= DifferMinute * hoursms
DifferSecond = Math.floor(Diffms / Secondms)
Diffms -= DifferSecond * Secondms
var dSecs = Math.floor(Diffms / microsecond)

if(convertHour != DifferHour) a=”<b><font color=red>”+DifferHour+”</font></b>天”;
if(convertMinute != DifferMinute) b=”<b><font color=red>”+DifferMinute+”</font></b>时”;
if(convertSecond != DifferSecond) c=”<b><font color=red>”+DifferSecond+”</font></b>分”
d=”<b><font color=red>”+dSecs+”</font></b>秒”
if (DifferHour>0) {a=a}
else {a=”}
document.getElementById(“leftTime”+key).innerHTML = a + b + c + d; //显示倒计时信息

}
</script>
<div class=”m m2″ id=”timed”>
<div class=”mt”>
<h2>限时抢购</h2>
<div class=”extra”></div>
</div>
<div class=”mc”>
<ul class=”lh”>
<!–{foreach from=$promotion_goods key=key item=goods name=name}–>
<!–{if $smarty.foreach.name.index <= 4}–>
<li id=”timed1″ class=”fore1″><div id=”leftTime{$key}” class=”countdown”>剩余<b>00</b>小时<b>00</b>分<b>00</b>秒</div><div class=”p-img ld”><a title=”{$goods.name|escape:html}” target=”_blank” href=”{$goods.url}”><img width=”130″ height=”130″ alt=”{$goods.name|escape:html}” data-img=”1″ src=”{$goods.thumb}”/></a></div><div class=”p-name”><a target=”_blank” title=”{$goods.name|escape:html}” href=”{$goods.url}”>{$goods.name|escape:html}</a><br>原价:<font style=”text-decoration:line-through; color:#CCCCCC; font-size:12px;”>{$goods.shop_price}</font></div><div class=”p-price”><span>抢购价:</span><strong><!– {if $goods.promote_price neq “”} –>
{$goods.promote_price}
<!– {else}–>
{$goods.shop_price}
<!–{/if}–></strong></div> </li>
<script>
Tday[{$key}] = new Date(“{$goods.gmt_end_time}”);
window.setInterval(function()
{clock({$key});}, 1000);
</script>
<!–{/if}–>
<!–{/foreach}–>
</ul>
</div>
</div>
<!– {/if} –>

然后在需要用到的地方调用一下就可以了:

<!– #BeginLibraryItem “/library/xianshi.lbi” –><!– #EndLibraryItem –>

以上代码可以应用在仿京东模板中,你也可以根据自己的需要替换相应的<div id=”timed”></div>中的内容即可

zhaoan

一个不起眼的IT工作者,从事过的行业较多,医疗保健、医院、月子会所、机电、重卡、软件,涉及的岗位也较多,零售、市场、平面设计、网站设计、UI设计、前端开发、后端开发、网络布线、设备维护、服务器维护、网络推广、网站运营、新媒体运营、部门管理等等,每个岗位工作基本都能独立完成,但是涉及面广导致都不精通,学习还在继续中。。。

You may also like...