jQuery实现为控件添加水印文字效果(附源码)_javascript技巧

本文实例讲述了jQuery实现为控件添加水印文字效果。分享给大家供大家参考,具体如下:

运行效果截图如下:

在线演示地址如下:

http://demo.jb51.net/js/2015/jquery-text-add-txt-style-codes/

具体代码如下:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
  <title>WaterMark</title>
  <script src="jquery-1.7.2.min.js" type="text/javascript"></script>
  <script src="jquery.tinywatermark.js"type="text/javascript"></script>
  <script type="text/javascript" language="javascript">
  $(function()
  {
    $("input[title='Month']").watermark('watermark','Title');
    $("textarea[title='Content']").watermark('watermark','Please input the content !');;
  });
  </script>
  <style type="text/css">
  .watermark {color:#999;}
  </style>
</head>
<body>
  <form id="form1" runat="server">
  <div>
  <div><input title="Month"/></div>
  <div><textarea id="TextArea1" cols="20" rows="2" title="Content"></textarea></div>
  </div>
  </form>
</body>
</html>

完整实例代码代码点击此处本站下载。

希望本文所述对大家jQuery程序设计有所帮助。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索jquery
, 控件
水印文字
javascript日历源码、javascript小游戏源码、javascript源码大全、javascript源码、javascript源码分析,以便于您获取更多的相关知识。

时间: 2024-10-06 00:16:43

jQuery实现为控件添加水印文字效果(附源码)_javascript技巧的相关文章

仿酷狗音乐播放器开发日志二十——换肤功能背景图片控件的制作(附源码)

转载请说明原出处,谢谢~~           <仿酷狗音乐播放器开发日志二十>里做了换肤功能的一部分,今天完成其他的部分.酷狗的换肤窗口里的背景图可以让用户选择来换图,原酷狗的背景图的小图标,有normal.hover.down等多种状态,鼠标移动上去便会发生变化.如图        当鼠标经过时会有个黑色图片覆盖,边框变为浅蓝色.并且在他上面显示出作者的一些信息.要实现这个效果应该另外开发一个控件来支持动态的信息展示效果.我把这个小控件的开发过程和源码发一下,给学习做duilib控件的新手

mac下dashboard小控件开发实例(附源码)

1.背景          用mac的用户都应该知道,mac有一个很好的功能,就是dashboard小控件的功能,按下F12键就可以自由切换.博主最近在背GRE单词,就尝试这开发了一个背单词的dashboard小控件.效果如图 2.步骤   (1)安转dashcode          这个是开发工具,用起来有点像xcode, 下载地址:https://developer.apple.com/downloads/index.action     (2)打开dashcode,新建项目      

jQuery+jsp实现省市县三级联动效果(附源码)_jquery

本文实例讲述了jQuery+jsp实现省市县三级联动效果的方法.分享给大家供大家参考,具体如下: 在这里,用MySQL数据库存储了全国所有的省市县地区信息(点击此处下载源代码) 使用过的jar包 google的Gson.jar mysql-connector-java-5.1.13-bin.jar 将实验图贴出来: 显示页面index.jsp <%@ page language="java" import="java.util.*" pageEncoding=

jQuery和hwSlider实现内容响应式可触控滑动切换效果附源码下载(二)_jquery

今天我们继续内容滑动切换效果的第二部分讲解.如今我们的web开发都要适应移动设备,就是说我们的web页面要在移动设备如手机端也能正常访问,所以我将第一部分的基本切换效果做了加强,增加了响应式和触控滑动效果. 效果展示     源码下载 本文是hwSlider-内容滑动切换效果的第二部分,演示DEMO都是基于第一部分内容的基础上的,所以,如果您还没阅读过第一部分的话,请先移步参阅:基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一) 响应式 什么是响应式设计,这里我就不描述了

基于Jquery制作图片文字排版预览效果附源码下载_jquery

基于jQuery图文排版图片预览特效.这是一款基于jQuery+CSS3实现的鼠标点击图片弹出画廊切换特效. 效果图如下所示,怎么样感兴趣吗,感兴趣的朋友继续往下学习哦. 效果演示     源码下载 html代码: <div id="fullscreen"> <div id="fullscreen-inner"> <div id="fullscreen-inner-left" class="fullscre

基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一)_jquery

内容滑动切换应用非常广,常见的有幻灯片焦点图.画廊切换等.随着WEB前端技术的广泛应用,内容滑动切换效果占据着web页面重要地位,因此本站Helloweba特别给广大前端爱好者安排了浅显易懂的内容滑动切换效果的开发教程. 先给大家展示下效果图,感觉还不错请参数实现代码,具体效果如下所示: 效果展示      源码下载 本次教程分三个部分: 1.使用jQuery开发基本的内容滑动切换效果, 2.支持移动端触控自适应的内容滑动切换效果, 3.封装内容滑动切换效果jQuery插件. 本文讲解第一部分,

Jquery插件之Fancybox丰富的弹出层效果附源码下载_jquery

Fancybox是一款优秀的jquery插件,它能够展示丰富的弹出层效果.前面我们有文章介绍了facybox弹出层效果,相比facybox,fancybox显得功能更为齐全,它除了可以加载DIV,图片.图片集.Ajax数据,还能加载SWF影片,iframe页面等等. 效果演示     源码下载 fancybox 特点: 可以支持图片.html 文本.flash 动画.iframe 以及 ajax 的支持: 可以自定义播放器的 css 样式: 可以以组的形式进行播放: 如果将鼠标滚动插件(mous

jQuery+Ajax+PHP弹出层异步登录效果(附源码下载)_jquery

弹出层主要用于展示丰富的页面信息,还有一个更好的应用是弹出表单层丰富交互应用.常见的应用有弹出登录表单层,用户提交登录信息,后台验证登录成功后,弹出层消失,主页面局部刷新用户信息.本文我们将给大家介绍如何使用jQuery+Ajax+PHP弹出层异步登录的应用. 效果展示        源码下载 HTML 由于本例UI部分使用了Bootstrap,以及使用jQuery插件,因此需要事先载入相关文件,推荐大家使用相关的CDN资源. <link rel="stylesheet" hre

jQuery拖拽排序插件制作拖拽排序效果(附源码下载)_jquery

使用jquery拖拽排序插件制作拖拽排序效果是一款非常实用的鼠标拖拽布局插件.效果图如下: 效果演示         源码下载 html代码: <h1>水平拖拽</h1> <div class="demo"> <div class="item item1"><span>1</span></div> <div class="item item2"><