Question

我正在尝试创建可在没有Flash的情况下工作的可扩展广告（即在iOS上）我是一名前端网页设计师，没有真正的Javascript知识。
我找到了一个示例代码，说明我如何创建广告，但它包含flash以激活扩展和撤消Javascript功能。

是否可以使用gif / jpg图片制作可展开的广告？我的意思是300x40移动广告，可以在水龙头上扩展到300x400全屏。

我真的很感激任何帮助。

Answer 1

我建议尝试使用 CSS3 ，然后正如我想象的那样，作为前端网页设计师，您对 CSS 感到满意。
我很确定悬停相当于大多数移动设备上的点按。

尝试以下方法：

<style>
.youradvert {
   overflow: hidden;
   width: 300px;
   height: 40px;
   -webkit-transition: all 1s;
   -moz-transition: all 1s;
   -o-transition: all 1s;
   transition: all 1s;
}
.youradvert:hover {
   height: 400px;
}
</style>

或者，如果点击与点击相同，您可以使用display:none设置图片并使用简单的 Javascript 功能更改显示值onclick。
你可能会发现点击实现比悬停更普遍，但我不确定。如果VISIBILITY没有办法，你可以使用DISPLAY。

如下所示：

<script type="text/javascript">
<!--
    function expand(){
        document.getElementById('large_ad').style.display=block;
    }
-->
</script>

<div class="youradvert">
   <img id="small_ad" src="http://example.com/image.jpg" onclick="expand()" alt="" style="width:300px;height:40px;"/>
   <img id="large_ad" src="http://example.com/image.jpg" style="display:none;width:300px;height:400px;" alt=""/>
</div>

制作可扩展的广告 - 没有闪存？

1 个答案: