placeholder插件及placeholder默认颜色修改
$.fn.placeHolder = function(){ $(this).each(function(i, el) { var self = $(el); if ($.browser.msie && !("placeholder" in $("<input/>")[0])) { if(self.attr("data-placeHolder")||!self.attr("placeholder")){ return; } self.attr("data-placeHolder",true); var that = $("<div/>"); var parent = self.parent(); if(parent.css("position")!=="absolute"&&parent.css("position")!=="fixed"){ parent.css("position", "relative"); } that.css({ "left": self.offset().left - parent.offset().left + parseInt(self.css("borderLeftWidth")), "top": self.offset().top - parent.offset().top + parseInt(self.css("borderTopWidth")), "width":self.width(), "height":self.height(), "lineHeight":self.css("lineHeight"), "fontSize":self.css("fontSize"), "paddingLeft":self.css("paddingLeft"), "paddingTop":self.css("paddingTop"), "textIndent":self.css("textIndent"), "position":"absolute", "color":"#666669", "outline":"none!important", "border":"none!important", "backgroundColor":"transparent", "cursor": "text" }); that.html(self.attr("placeholder")); parent.append(that); that.on("click", function() { self[0].focus(); }); function showPlaceholder() { if (self.val() === "") { that.show() } else { that.hide(); } } self.on("input propertychange", showPlaceholder); showPlaceholder(); } }); }; $(function() { $("[placeholder]").placeHolder(); });
改变placeholder的默认颜色代码如下:
::-moz-placeholder{color:red;} //ff ::-webkit-input-placeholder{color:red;} //chrome,safari :-ms-input-placeholder{color:red;} //ie10
Placeholder插件在支持自带placeholder的浏览器原样显示不处理,低版本在同级创建div。(记得引入jQuery)
placeholder插件及placeholder默认颜色修改的更多相关文章
- IE10以下兼容H5中的placeholder 以及改变它默认颜色
placeholder是H5<input>的属性之一,可惜在IE10以下不支持,万恶的IE!不过正因为有IE,才多了很多捣鼓,添了乐趣.不支持就不支持呗,自己动手丰衣足食,我们可以用js模 ...
- input,select默认颜色修改
input::-webkit-input-placeholder{color: #7f7f7f;} select{color: #7f7f7f} option{color: #7f7f7f;}
- 修改输入框placeholder文字默认颜色-webkit-input-placeholder
html5为input添加了原生的占位符属性placeholder,高级浏览器都支持这个属性,例如: <input type="text" placeholder=" ...
- 【css】修改placeholder 默认颜色
html5为input添加了原生的占位符属性placeholder,高级浏览器都支持这个属性,例如: <input type="text" placeholder=" ...
- HTML5 input placeholder 颜色修改示例
Chrome支持input=[type=text]占位文本属性,但下列CSS样式却不起作用: CSS 复制代码 代码如下: input[placeholder], [placeholder], *[p ...
- Html5 input placeholder 属性字体颜色修改。
这篇文章主要介绍了有关HTML5 input placeholder 颜色修改方面的知识,需要的朋友可以参考下 Chrome支持input=[type=text]占位文本属性,但下列CSS样式 ...
- input的placeholder文字颜色修改
input::-webkit-input-placeholder { color: #D6D0CA !important; /* WebKit browsers / } input:-moz-plac ...
- css3 input placeholder颜色修改方法
css3 input placeholder颜色修改方法<pre> input::-webkit-input-placeholder { /* placeholder颜色 */ color ...
- input placeholder 文字颜色修改
placeholder 文字颜色修改 input::-webkit-input-placeholder{ color:red; } input::-moz-placeholder{ /* Mozill ...
随机推荐
- XtraReport 实例化 打印
// Create a report instance, assigned to a Print Tool. ReportPrintTool pt = new ReportPrintTool( ...
- C++学习5
类是创建对象的模板,一个类可以创建多个对象,每个对象都是类类型的一个变量:创建对象的过程也叫类的实例化.每个对象都是类的一个具体实例(Instance),拥有类的成员变量和成员函数. 与结构体一样,类 ...
- JAVA中的定时调度(Timer和TimerTask)
某些时候我们需要定时去完成一些任务,这里举一个例子:我们需要在3秒钟后打印当前系统时间,此后每隔5秒重复此操作.代码如下: import java.util.TimerTask; import jav ...
- 查看.netframeword版本
打开“我的电脑“,在地址栏输入 %systemroot%\Microsoft.NET\Framework
- Delphi 连接mysql 的功能, 去除乱码, 需要设置字符集
vDataBaseName := aConfiginiFile.ReadString('DataBaseConfig', 'DataBase', CH_IPC712Db); vServer := aC ...
- LayoutInflater的实例化
获得 LayoutInflater 实例的三种方式 1. LayoutInflater inflater = getLayoutInflater(); //调用Activity的getLayoutI ...
- oracle插入主键数据、sequence和触发器
一.创建表: id number;并设为主键 name VARCHAR2(20 BYTE) 二. 插入数据 2.1 insert into addservice.test_table (id,na ...
- 403 Forbidden
http://baike.baidu.com/link?url=JJXC_XqJ2d-twe1dhbLUiRgvZU5OfneRURT4LvrtWBqv9Av4J0GPOlwk3KQuRx4Hzu4N ...
- 30. Distinct Subsequences
Distinct Subsequences OJ: https://oj.leetcode.com/problems/distinct-subsequences/ Given a string S a ...
- JavaScript自己模仿jQuery的一点小代码
function seter(sId) { var obj = document.getElementById(sId); return new function () { ...