查看: 2785|回复: 1
打印 上一主题 下一主题

javascript如何做点击图片地址显示图片

[复制链接]

2206

主题

2

听众

3万

积分

资深设计师

Rank: 7Rank: 7Rank: 7

纳金币
32449
精华
23

最佳新人 活跃会员 热心会员 灌水之王 突出贡献

跳转到指定楼层
楼主
发表于 2013-4-11 16:38:53 |只看该作者 |倒序浏览
类似于这种,上传图片后显示图片地址,鼠标移到地址上就显示图片的方法,跟微博的上传图片一样

分享到: QQ好友和群QQ好友和群 腾讯微博腾讯微博 腾讯朋友腾讯朋友 微信微信
转播转播0 分享淘帖0 收藏收藏0 支持支持0 反对反对0
回复

使用道具 举报

2206

主题

2

听众

3万

积分

资深设计师

Rank: 7Rank: 7Rank: 7

纳金币
32449
精华
23

最佳新人 活跃会员 热心会员 灌水之王 突出贡献

沙发
发表于 2013-4-11 16:39:19 |只看该作者
在上传图片之前存放相关信息的位置是被隐藏的,当你上传完图片后可以通过jquery或js把相关信息添加到页面相应的位置。然后通过鼠标事件控制图片的显示。

下面是一个简单的显示图片的方法。
<script type="text/javascript" src=" http://static.mogupai.com/js/jquery.js"></script>
<script type="text/javascript">
<!--
$(window).load(function(){
$("#img_url").mouseover(function(){
$("#show_img").show();
}).mouseleave(function(){
$("#show_img").hide();
});
});
//-->
<!--</script>
<div class='all'>
<div id='img_url'>http://s.mogupai.com/sheepManage/Public/Upload/pic/133171427647.jpg</div>
<div id='show_img' style='display:none;width:161px;height:62px;'>
<img src='http://s.mogupai.com/sheepManage/Public/Upload/pic/133171427647.jpg' width='161' height='62' />
</div>
</div>
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

手机版|纳金网 ( 闽ICP备2021016425号-2/3

GMT+8, 2024-11-15 23:55 , Processed in 0.321465 second(s), 32 queries .

Powered by Discuz!-创意设计 X2.5

© 2008-2019 Narkii Inc.

回顶部