html5通过浏览器调用手机相机

基本需求，是点击网页中头像图片，弹出提示：手机、相册、文件管理器……

相机拍照后，自动上传图片。不知道为什么，相册选择的图片无法正常上传。

<form id="form1" action="3.php" method="post" enctype="multipart/form-data" target="hidden_frame">
<input type="file" id="upfile" name="upfile" accept="image/*" class="up_input" onchange="form1.submit()" ><span class="up_icon"></span>
<input type="submit" />
</form>
<iframe name='hidden_frame' id="hidden_frame" style='display:none'></iframe>
<style type="text/css">
.up_icon,.up_input {position: absolute;top: 10px;left: 110px;width: 64px;height: 64px;z-index: 2}
.up_icon {overflow: hidden;font-size: 0;line-height: 99em;background: url(/data/upload/shop/common/default_user_portrait.gif) no-repeat 0 0;z-index: 1;}
</style>
<script type="text/javascript">
upfile.style.opacity = "0";
</script>

参考：http://www.webhek.com/browser-camera