加载中…
个人资料
阳光浪子的博文
阳光浪子的博文
  • 博客等级:
  • 博客积分:0
  • 博客访问:30,014
  • 关注人气:11
  • 获赠金笔:0支
  • 赠出金笔:0支
  • 荣誉徽章:
相关博文
推荐博文
谁看过这篇博文
加载中…
正文 字体大小:

蚂蚁分类系统portal模版热门商铺在IE8下面不能滚动的问题

(2012-09-07 20:19:47)
标签:

蚂蚁分类系统

彭彭滚动组件

ie8

兼容

it

分类: 技术交流

蚂蚁分类系统portal模版热门商铺在IE8下面不滚动,要开启兼容模式才会滚动。

该系统用的是彭彭滚动组件1.0,是2007年的代码,开始还以为是这个组件和ie的兼容有问题,于是将彭彭的demo.html中的代码复制到portal.html中测试,一切正常!

进过反复调试,发现蚂蚁分类系统中的热门商铺是如下的结构

<div id="shop">
<div id="shop1">[多个热门商铺的内容]</div>
<div id="shop2"></div>
</div>
   
其中,多个热门商铺的内容是用smarty模版语句从数据库中读取的,

<li>商铺1</li>
<li>商铺2</li>
<li>商铺3</li>
……
然后我发现,这些<li>
是通过定义style="float:left" 来实现排列的,结果是每行7个。
因为用float来实现格式,因此,其行数是不可预知的,我想,是不是因为内容的高度的不确定信导致了滚动的失效呢?

于是,修改了代码,在<div id="shop1">里面,内容外面增加了一个<ul style="height:270px;">。重新刷新,果然代码滚动起来了!(270px是滚动代码外框架的高度),用<div>或者<li>都可以,只是习惯觉得
<li>外面应该有个<ul>, 所以这样用了。
 

最后列出明细代码:

-------------------------------------

原portal.html中热门商铺部分代码:

  
<div id="shop">
            <div class="bd" id="shop1">
                {foreach from=$members item=members}
                <li class="item"><a href="{$members.uri}" target="_blank" ><img src="{$config.SiteUrl}{$members.prelogo}"  alt="{$members.tname|truncate:'16'}"/></a> <span class="title"><a href="{$members.uri}" target="_blank">{$members.tname|truncate:'16'}</a></span><span  class="sale">店主:  {$members.userid}</span> </li>
                {/foreach}
            </div>
     <div id="shop2"></div>
</div>

-----------------------------------------
修改后的这部分代码:

<div id="shop">
            <div class="bd" id="shop1">
                <ul style="height:270px;">
                {foreach from=$members item=members}
                <li class="item"><a href="{$members.uri}" target="_blank" ><img src="{$config.SiteUrl}{$members.prelogo}"  alt="{$members.tname|truncate:'16'}"/></a> <span class="title"><a href="{$members.uri}" target="_blank">{$members.tname|truncate:'16'}</a></span><span  class="sale">店主:  {$members.userid}</span> </li>
                {/foreach}
              </ul>
            </div>
     <div id="shop2"></div>
</div>   

0

阅读 评论 收藏 转载 喜欢 打印举报/Report
  • 评论加载中,请稍候...
发评论

    发评论

    以上网友发言只代表其个人观点,不代表新浪网的观点或立场。

      

    新浪BLOG意见反馈留言板 电话:4000520066 提示音后按1键(按当地市话标准计费) 欢迎批评指正

    新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 会员注册 | 产品答疑

    新浪公司 版权所有