web常用小技术集合

1，回到顶部效果

	$("body").animate({ scrollTop: "0px" }, 700);

2，获取屏幕滚动值

	   //获得滚动的像素，这个方法一滚动就会被执行
		   window.οnscrοll=function(){  
    var top = document.documentElement.scrollTop||document.body.scrollTop;     
	} 

3，获取子元素离顶端的距离

var value = $(".child").offset().top;

4，在html文件里导入html文件

$(".box2").load("index2.html");

<iframe src="index2.html" class="child"></iframe>

5，json字符串数组转换为数组对象，data = [{},{}]。

//jsonArray string transformation arrayObject
var arrayValue = eval(data);

6，<iframe>的用法：

<iframe src="main.html" marginwidth="0" frameborder="no" scrolling="no"></iframe>

7，使文本左右对齐，一个要加上这个属性display: inline-block;

text-align: justify;
		text-justify: distribute;
		 display: inline-block;
		 text-justify:distribute-all-lines;/*ie6-8*/
      	text-align-last:justify;/* ie9*/
      	-moz-text-align-last:justify;/*ff*/
      	-webkit-text-align-last:justify;/*chrome 20+*/

8，compatible ie浏览器使输入框显示提示文本

 var placeholderfriend = {
     focus: function(s) {
       s = $(s).hide().prev().show().focus();
       var idValue = s.attr("id");
       if (idValue) {
         s.attr("id", idValue.replace("placeholderfriend", ""));
       }
       var clsValue = s.attr("class");
    if (clsValue) {
         s.attr("class", clsValue.replace("placeholderfriend", ""));
       }
     }
   }

  //判断是否支持placeholder
   function isPlaceholer() {
     var input = document.createElement('input');
     return "placeholder" in input;
   }
   //不支持的代码
  if (!isPlaceholer()) {
     $(function() {

      var form = $(this);

      //遍历所有文本框，添加placeholder模拟事件
      var elements = form.find("input[type='text'][placeholder]");
       elements.each(function() {
         var s = $(this);
         s.addClass('com_gray');
         var pValue = s.attr("placeholder");
   var sValue = s.val();
         if (pValue) {
           if (sValue == '') {
             s.val(pValue);
           }
         }
       });

      elements.focus(function() {
         var s = $(this);
         var pValue = s.attr("placeholder");
         	s.removeClass('com_gray');
   var sValue = s.val();
         if (sValue && pValue) {
           if (sValue == pValue) {
             s.val('');
           }
         }
       });

      elements.blur(function() {
         var s = $(this);
         var pValue = s.attr("placeholder");
          if(s.val().length == 0){
         	s.addClass('com_gray');
         }
   var sValue = s.val();
         if (!sValue) {
           s.val(pValue);
         }
       });

      //遍历所有密码框，添加placeholder模拟事件
      var elementsPass = form.find("input[type='password'][placeholder]");
       elementsPass.each(function(i) {
         var s = $(this);
         var pValue = s.attr("placeholder");
         s.addClass('com_gray');
   var sValue = s.val();
         if (pValue) {
           if (sValue == '') {
             //DOM不支持type的修改，需要复制密码框属性，生成新的DOM
             var html = this.outerHTML || "";
             html = html.replace(/\s*type=(['"])?password\1/gi, " type=text placeholderfriend")
               .replace(/\s*(?:value|on[a-z]+|name)(=(['"])?\S*\1)?/gi, " ")
               .replace(/\s*placeholderfriend/, " placeholderfriend value='" + pValue
               + "' " + "οnfοcus='placeholderfriendfocus(this);' ");
             var idValue = s.attr("id");
             if (idValue) {
               s.attr("id", idValue + "placeholderfriend");
             }
             var clsValue = s.attr("class");
    if (clsValue) {
               s.attr("class", clsValue + "placeholderfriend");
             }
             s.hide();
             s.after(html);
           }
         }
       });

      elementsPass.focus(function(){
      	$(this).removeClass('com_gray');
      }).blur(function() {
         var s = $(this);
         var sValue = s.val(); 
         if(sValue.length == 0){
         	s.addClass('com_gray');
         }
         if (sValue == '') {
           var idValue = s.attr("id");
           if (idValue) {
             s.attr("id", idValue + "placeholderfriend");
           }
           var clsValue = s.attr("class");
     if (clsValue) {
             s.attr("class", clsValue + "placeholderfriend");
           }
           s.hide().next().show();
         }
       });

    });
   }
   window.placeholderfriendfocus = placeholderfriend.focus;


css代码
.com_gray{color: #999999;}