【www.gdgbn.com--jquery】

jquery 弹表单提示效果代码,这种效果其实也叫标题 tips教程效果，很多时候是在表单或者文本输入框有这样的提示了，下面我们提供了下效果图。

<script>
$(function() {
$(".input,.login_input,.textarea").focus(function() {
$(this).addclass("focus");
}).blur(function() {
$(this).removeclass("focus");
});
//输入框提示,获取拥有hinttitle,hintinfo属性的对象
$("[hinttitle],[hintinfo]").focus(function(event) {
$("*").stop(); //停止所有正在运行的动画
$("#hintmsg").remove(); //先清除，防止重复出错
var hinthtml = "

• " + $(this).attr("hinttitle") + "" + $(this).attr("hintinfo") + "
• "; //设置显示的内容
  var offset = $(this).offset(); //取得事件对象的位置
  $("body").append(hinthtml); //添加节点
  $("#hintmsg").fadeto(0, 0.85); //对象的透明度
  var hintheight = $("#hintmsg").height(); //取得容器高度
  $("#hintmsg").css({ "top": offset.top - hintheight + "px", "left": offset.left + "px" }).fadein(500);
  }).blur(function(event) {
  $("#hintmsg").remove(); //删除ul
  });
  });
  </script>
  
  
  
  
  <asp教程:textbox id="textbox1" runat="server" hinttitle="增加的内容信息标题" hintinfo="控制在100个字数内，标题文本尽量不要太长。">
  
  

本文来源：http://www.gdgbn.com/wangyezhizuo/29888/