qTip Style
2012-07-28 09:57 java线程例子 阅读(205) 评论(0) 编辑 收藏 举报@author YHC
Style
这个style对象允许你分配自定义样式给主要的qTip元素,和ThemeRoller tip选项,当使用tips plugin的时候:
classes:""
概述:
添加样式的时候使用空格隔开字符串来包含多个样式名称,应该添加给主要的qTip元素的样式名称;
以下有几个基础样式,包含在css文件中的提供的,主要包含:
/* CSS2 styles */ ui-tooltip{ } /* This one is applied by default (formally the "cream" style) */ ui-tooltip-plain{ } ui-tooltip-light{ } ui-tooltip-dark{ } ui-tooltip-red{ } ui-tooltip-green{ } ui-tooltip-blue{ } /* CSS3+ styles */ ui-tooltip-shadow{ } /* Adds a shadows to your tooltips */ ui-tooltip-rounded{ } /* Adds a rounded corner to your tooltips */ ui-tooltip-bootstrap{ } /* Bootstrap style */ ui-tooltip-tipsy{ } /* Tipsy style */ ui-tooltip-youtube{ } /* Youtube style */ ui-tooltip-jtools{ } /* jTools tooltip style */ ui-tooltip-cluetip{ } /* ClueTip style */ ui-tooltip-tipped{ } /* Tipped style */示例:
创建一个qTip,包含一个绿色的主题和一个阴影的效果:
$('.selector').qtip({ content: { text: 'I\'m blue... deal with it!' }, style: { classes: 'ui-tooltip-blue ui-tooltip-shadow' } });def:true
概述:
这个属性允许你防止.ui-tooltip-default被应用到主要的qTip元素:
注意:如果这样做了之后将导致qTip没有视觉风格,如果你没有应用任何的自定义样式的情况之下;
widget:false;
概述:
决定是否ui-widget样式的ThemeRoller UI样式应用到你的qTip元素;
注意:关于ThemeRoller更多的信息请点击该超链接,查看API Theme Roller API
width:false
概述:
这个属性允许你重写所有css样式中应用的width属性,任何合法css width值,亲!!请注意:没有重写max/min样式值,在css文件中改变这些;
注意:亲!在重申一遍,这个没有重写max/min 宽度样式值.
height:false:
概述:
这个属性允许你重写所有应用在qTip元素的css height属性值,任何有效的css height值,亲!!!!请注意:这个并没有重写css max/min height属性值,在css
文件中去改变这些;
注意:亲!!在重申一遍,这个没有重写css样式中的max/min height属性;
tip:Object:
概述:
定义qTip的tip属性,请见plugin documentation 文档,里面信息更为详细
以上如果有错误信息,还请指出Thanks!