vue项目接口域名动态的获取方法
200
2023-07-03
类似于QQ的右滑删除效果的实现方法
原理:删除http://的div在窗口的外面,用户看不到,用户右滑,显示次div
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
*{
margin:0px;
padding: 0px;
font-size: 14px;
box-sizing: border-box;
}body{overflow: hidden;width:100%;height:100%;}
#list{
border-top:1px solid #e6e6e6;
}
ul li{
list-style-type: none;
width: 100%;
height:60px;
position: relative;
border-bottom:1px solid #e6e6e6;
}
div#header{
width: 100%;
height:45px;
text-align: center;
line-heighthttp://: 45px;
border-bottom:1px solid #e6e6e6;
margin-bottom: 10px;
}
li p{
height:30px;
margin-left: 75px;
}
.right{float: right;}
.time{margin-right: 24px;display:none;border-radius:50%;width:15px;height:15px;background-color:red;margin-top:20px;font-size:13px;text-align:center;line-height:15px;color:white;}
.img-box{
width:40px;height:40px;margin:10px 0px 10px 24px;position:absolute;
}
.blank{width:100%;height:15px;}
.delfriend{height:60px;width:70px;background-color:red;display:block;position:absolute;top:0px;right:-70px;line-height:60px;color:#ffffff;text-align:center;z-index:13}
var w=$(window).width()+"px";
var h=$(window).height()+"px";
$("body").css({"width":w,"height":h});
小纸条
uu
删除
$("#myf").unbind().on("touchstart",".myfriend",function (e) {
e.preventDefault();
var _a= e.originalEvent.targetTouches[0];
start=_a.pageX;
friendid=$(this).attr("data-friendid");
}).on("touchend",".myfriend", function (e) {
e.preventDefault();
var _a= e.originalEvent.changedTouches[0];
end=_a.pageX;
if(start-end<0){
$("#del_"+friendid).animate({"margin-left":"0px"},1000);
}else if(start-end>0){//向右滑动,删除好友
$(".myfriend").not("#del_"+friendid).animate({"margin-left":"0px"},1000);
$("#del_"+friendid).animate({"margin-left":"-70px"},1000);
}else{
var cls=$(e.target).attr("data-cls");
console.log(cls);
var ff=$(e.target).attr("data-friendid");
if(cls=="delfriend")delfriend(ff);
else{
window.location="wap/kuaiqin/sr_index?smDROlEballmy="+localStorage.tokenforkuaiqin+"&friendid="+friendid;
}
}
});
版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。
发表评论
暂时没有评论,来抢沙发吧~