发表于: 2017-03-27 20:20:45
1 587
今天完成的事:
1.用jq写了css15的轮播图。为了解决之前的塌陷问题,重新写了html。
现在是这样
<div class="banner">
<ul class="banner-img">
<li><img src="images/banner-0.jpg" class="banner-li-img img-active" alt=""></li>
<li><img src="images/banner-1.jpg" class="banner-li-img" alt=""></li>
<li><img src="images/banner-2.jpg" class="banner-li-img" alt=""></li>
<ul class="banner-index">
<li class="index-li-active"></li>
<li></li>
<li></li>
</ul>
<p class="btn btn-left" id="btnLeft"><</p>
<p class="btn btn-right" id="btnRight">> </p>
</ul>
</div>
把banner图统一设置为display:none;写一个类.img-active{display:block!important;}用jq给想要显示的图片添加类.img-active,同时移除同级兄弟节点中含有的类.img-active。以这种方式达到更换图片。这样过渡比较生硬,于是在css文件中给.img-active类添加了淡入淡出的动画。
把下方小圆点目录与图片显示绑定,点击小圆点更换显示的图片。
还剩两个需求,点击左右按钮切换图片和没有点击时图片自动轮播。左右按钮切换用了jq的trigger()方法,在按钮的点击函数里调用小圆点的click事件;图片自动轮播设置定时器,在定时器函数中同样用trigger()调用小圆点的click事件。记得调用之前先clearInterval。
jq中使用setInterval()写法:
写法一:
function
jump(){
…………
//函数内容
}
time = setInterval(
"jump"
,5000);
//每个五秒调用一次函数
写法二:
function
autoPlay(){
time = setInterval(
function
(){
…………
//函数内容
},5000);
}
autoPlay();
写法三:
var timer;
timer=setInterval(function(){
.....
},1000 );
2。根据任务5给的流程。先是尝试配置nginx。
启动nginx,在浏览器输入localhost,显示403forbidden。
后来查出原因在于缺少index.html。如果在/home/XXX/www下面没有index.php,index.html的时候,直接访问域名,找不到文件,会报403 forbidden。
了解了nginx是一个性能很好的反向代理服务器,用来做负载均衡。
正向代理:隐藏了真实的请求客户端,服务端不知道真实的客户端是谁,客户端请求的服务都被代理服务器代替来请求。
反向代理:隐藏了真实的服务端。就像拨打10086一样,背后可能有成千上万台服务器为我们服务,但具体是哪一台,你不知道。
叫法是因为出现的时间先后。先有的正向代理,所以后出现的一个叫反向代理。
听师姐讲解了nginx配置文件中每条的意思和注意的点,知道了 listen是监听端口,自定义的四位数字,server_name是自定义的字符只要跟之前没重名,location中index的作用。
3.看了红宝书中AJAX章节。
知道了AJAX技术核心是XHR,就是无需刷新就可以从服务器获取数据。又看了后面的一些方法,但有点懵。
明天要做的事:开始动手写。
遇到的问题:ajax向谁请求数据。
梳理流程大致是 var xhr=creatXHR(),判断readyState后,open,send。那么open("get","aaaa.html")中,这个网址就是要请求的网站吗?
为了保障安全,应该是需要对暗号密码之类的东西。这些又该怎么表达?
收获:如上。
评论