wap手机站常用三种特效：返回顶部触屏滑动input输入文字删除

第一种：input输入文字可以删除

<div class="lv-search search">
  <div class="lv-div-search">
	  <form method="post" action="/clutter/place" id="key_search">
	    <span class="lv-clear-icon01" onClick="union_clear_context('keyword');" style="" id="clear_password">
               <img src="images/clear.png"></span>
		  <input class="lv-input-search" id="keyword" type="text" onFocus="ke_focus(this);" onBlur="key_blur(this);" value="上海" placeholder="请输入景点目的地/关键字" autocomplete="off">
	      <input type="hidden" name="keyword" id="hidden_keyword" value="上海" data-name="">
	       <input type="button" class="btn_sub" value="" onClick="btnClick()">
	  </form>
    
      <input type="hidden" name="toDest" id="toDest" value="上海" data-name="">
      <input type="hidden" name="subjects" id="subjects" value=" " data-name="">
      <input type="hidden" name="sort" id="sort" value="" data-name="">
      <input type="hidden" name="stage" id="stage" value="2" data-name="">
      <input type="hidden" name="page" id="page" value="1" data-name="">
  </div>
  <div class="lv-auto-complete lv-spot-autocomplete" id="search_autocomplete" style="display:none;">
    	<ul class="lv-search-ul" id="search_success">
        </ul>
    </div>
 </div>

// 清空输入框内容 id 输入框id
function union_clear_context(id) {
	$("#search_autocomplete").hide();
	if ($("#" + id).length > 0) {
		$("#" + id).val("");		
	}
}

	/*搜索*/
function btnClick(){
	$("input[name='keyword']").val(encodeURI($("#hidden_keyword").val()));
	$("#key_search").submit();
	$("input[name='keyword']").val("");
}
document.onkeydown=function(event){
    var e = event || window.event;      
    if(e && e.keyCode==13){
    	btnClick();
    }
}

第二种：触摸banner效果

<div class="m_banner" id="owl">
            <a href="#" class="item"><img src="images/10250290397.png"></a>
            <a href="http://www.178hui.com" class="item"><img src="images/10225357963.jpg"></a>
            <a href="#" class="item"><img src="images/10250290397.png"></a>
            <a href="http://www.178hui.com" class="item"><img src="images/10225357963.jpg"></a>
      </div>

第三种：返回顶部

$(document).ready(function(){
	$(window).scroll(function () {
		var scrollHeight = $(document).height();
		var scrollTop = $(window).scrollTop();
		var $windowHeight = $(window).innerHeight();
		scrollTop > 75 ? $(".gotop").fadeIn(200).css("display","block") : $(".gotop").fadeOut(200).css({"background-image":"url(images/iconfont-fanhuidingbu.png)"});
	});
	$('.backtop').click(function (e) {
		$(".gotop").css({"background-image":"url(images/iconfont-fanhuidingbu_up.png)"});
		e.preventDefault();
		$('html,body').animate({ scrollTop:0});
	});
});