js调用相册

JavaScript019

js调用相册,第1张

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>HTML5页面如何在手机端浏览器调用相机、相册功能</title>

</head>

<style>

.addFile {

width: 50px

height: 50px

background-color: red

}

</style>

<body>

</body>

</html>

绝对可以，直接看代码，jquery中的append方法：

jsp中，相片是放在<ul></ul>里边的吧。

$(function(){

var img = ""

for(var i=i<10i++){//你要加多少照片，i就小于等于多少

img+="<li><img src="image/"+i+".jpg"/></li>"//将要添加的li标签循环拼起来

}

$("ul").append(img)//将li标签写入到ul中。

})

这样就看到你要的效果了。自己导入jquery的库。你应该懂

<style type="text/css">

body{background:black}

.point{position:absoluteheight:75pxborder:1px silver solid}

#round{position:absolutebackground:redwidth:200pxheight:200px}

</style>

<script>

var r=200,dv=0.01,w=100,x=400y=100,pn=8

var pi=3.1415926575,d=pi/2

var pd=Math.asin(w/2/r)ed=pi*2/pnsmove=true

function window.onload(){

var o=document.getElementById("imground")

var arrimg=o.getElementsByTagName("img")

for (n=0n<arrimg.lengthn++){

arrimg[n].onmouseout=function(){smove=true}

arrimg[n].onmouseover=function(){smove=false}

arrimg[n].onmousedown=function(){dv=dv*2}

}

setInterval(roundMove,20)

}

function roundMove(){

for (n=1n<=8n++){

var o=document.getElementById("p"+n)

var ta=Math.sin(d+ed*n)

var strFilter

if (ta<0)o.style.left=Math.cos(d+ed*n-pd)*r+x

else o.style.left=Math.cos(d+ed*n+pd)*r+x

o.style.top=ta*10+10+y

o.style.width=Math.abs(Math.cos(d+ed*n+pd)-Math.cos(d+ed*n-pd))*r

o.style.zIndex=ta*10

if (o.style.zIndex<0) strFilter="FlipH(enabled:true)"

else strFilter="FlipH(enabled:false)"

if (ta<0) ta=(ta+1)*80+20else ta=100

strFilter=strFilter+" alpha(opacity="+ta+")"

o.style.opacity=ta/100

o.style.filter=strFilter

}

if (smove) d=d+dv

}

</script>

<div id="imground">

<img class="point" id="p1" src="1.jpg"/>

<img class="point" id="p2" src="2.jpg"/>

<img class="point" id="p3" src="3.jpg"/>

<img class="point" id="p4" src="4.jpg"/>

<img class="point" id="p5" src="5.jpg"/>

<img class="point" id="p6" src="6.jpg"/>

<img class="point" id="p7" src="7.jpg"/>

<img class="point" id="p8" src="8.jpg"/>

</div>看看这个是不是你要的效果。