QQ2013搜索框 JS特效怎么写

JavaScript023

QQ2013搜索框 JS特效怎么写,第1张

样式自己在修改修改吧

<!doctype html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

<style>

#show span {background-color: bluecolor: #fffmargin:3px}

#in{background-color: transparentcolor: transparent}

#show,#in{

width:500px

height:30px

font-size: 20px

line-height: 30px

position: absolute

top:0px

}

</style>

</head>

<body>

<div id="show"></div>

<input id="in" type="text">

<script>

var show = document.getElementById('show')

var input = document.getElementById('in')

show.onfocus = function(){

}

document.onkeyup = function(){

show.innerHTML = function(){

var a = input.value.split('')

var b = a.pop()

a = '<span>' + a.join('</span><span>')+'</span>' + b

return a

}()

}

</script>

</body>

</html>

<script>

function change() {

            var divDisp = document.getElementById("search").style.display

            if (divDisp == "block") {

                document.getElementById("search").style.display = "none"

            } else {

                document.getElementById("search").style.display = "block"

            }

        }

</script>

<body>

<input id="btnChange" type="button" onclick="change()" value="点我改变"/>

<div id="search" style="display:none">

<input id="searchText" type="text" />

</div>

</body>

<input type="button" onclick="goto()" />

<script>

window.location.href='http://网址/list-catid-"+document.getElementById("caixi").value+"-aid-"+document.getElementById("diqu").value +"'

</script>