3D slider 项目经验

1.url: localStorage.jsonUrl || "http://dev.kadashow.com:8000/api/v1/galleryshare/"+ ziduan +"=/?format=jsonp",

这样可以在localStorage中 输出键值对 “jsonUrl” ：“./wenjianming” wenjianming是网站更目录的jsonp文件名，如下图

2.jsonpCallback: 'success_jsonpCallback', 这个回调函数名是 wenjianming文件中 jsonp的

3.单页面调试可以npm install -g live-server，启动则是在根目录 执行  live-server ./

4.屏幕横竖判断及处理方法

// 判断屏幕方向
$(window).resize(function(e){
  // console.log('resize');
  var $w = $(window),
      $wrap = $('.container'),
      ww = $w.width(),
      wh = $w.height(),
      transform;
  if(ww > wh){
    // 横屏模式
    $wrap.css('-webkit-transform','rotate(0deg) translate(0,0)') // ios7 及早期版本android 下 必须添加该样式才能保证旋转到横屏后显示正常
         .css('transform','rotate(0deg) translate(0,0)')
         .css('width', '100%')
         .css('height', '100%')
         .addClass('landscape')
         .removeClass('portrait');
  }else{
    // 竖屏模式
    transform = 'rotate(-90deg) translate(-100%,0)';
    $wrap.css('-webkit-transform',transform)
         .css('transform',transform)
         .css('width', wh + 'px')
         .css('height', ww + 'px')
         .removeClass('landscape')
         .addClass('portrait');
  }
  console.log('resize');
}).trigger('resize');

 5.要弄清js文件的执行顺序，可以用console.log输出来帮助弄清顺序。

6.页面内不要写js程序 模块化拿出来 卸载单个js文件中

7.尽可能不要去修改插件

8.简单响应是可以用flex布局，不用考虑兼容性。

9.ajax在success中写回调

10.touch事件 输出event查属性；

11.

在微信浏览器中使用如下代码来动态修改浏览器上的title标题：

var $body = $('body');
document.title = '这里是要修改成的新标题';

var $iframe = $('<iframe src="/favicon.ico"></iframe>');
$iframe.on('load',function() {
  setTimeout(function() {
      $iframe.off('load').remove();
  }, 0);
}).appendTo($body);