jQuery上传预览图片

<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<script type="text/javascript" src="http://www.cssrain.cn/demo/JQuery+API/jquery-1[1].2.1.pack.js"></script>
<script language="javascript">
$(function(){
    var ei = $("#large");
    ei.hide();
    $("#img1, img").mousemove(function(e){
        ei.css({top:e.pageY,left:e.pageX}).html('<img style="border:1px solid gray;" src="' + this.src + '" />').show();
    }).mouseout( function(){
        ei.hide();
    })
    $("#f1").change(function(){
        $("#img1").attr("src","http://www.cnblogs.com/Pynix/admin/file:///"+$("#f1").val());
    })
});
</script>
<style type="text/css">
    #large{position:absolute;display:none;z-index:999;}
</style>
</head>
<body>

上传预览图片:<br>
<input id="f1" name="f1" type="file" /><br>
<img id="img1" width="120" height="60" src="http://www.cssrain.cn/skins/tim/logo-jq.gif">

<div id="large"></div>

<br><br><br><br><br><br>
鼠标滑过预览图片:<br>
<img width="120" height="60" src="http://www.cssrain.cn/skins/tim/logo-jq.gif"><br>
<img width="120" height="60" src="http://www.cssrain.cn/demo/JQuery+API/logo-json.gif"><br>
</body>
</html>

本篇文章来源于 cssrain.cn 原文链接：http://www.cssrain.cn/article.asp?id=538

相关阅读:
hdu3829（最大独立集）
hdu2444（判二分图+最大匹配）
hdu2063+hdu1083（最大匹配数）
hdu3622（二分+two-sat）
poj3678(two-sat)
hdu1824(two-sat)
hdu3062（two-sat）
POJ1067 取石子游戏
POJ1066 Treasure Hunt
POJ1065 Wooden Sticks

原文地址：https://www.cnblogs.com/Pynix/p/1447033.html