本文实例讲述了JQuery实现动态适时改变字体颜色的方法。分享给大家供大家参考。具体分析如下: JQuery动态适时改变字体的颜色,Ajax的效果类似,在文本框输入文字,再选择色块,输入的文字就会变成色块标示的颜色值,很不错的效果吧。如果运行有错,请刷新一次页面即可。 复制代码 代码如下: JQuery动态改变字体颜色 <br /> h1 {<br /> font:bold 15px/19px Georgia, serif;<br /> }<br /> p {margin:0;}<br /> #colorselections a {<br /> border:2px solid #fff;<br /> margin-right:4px;<br /> display:block;<br /> float:left;<br /> }<br /> a img {<br /> border:1px solid #fff;<br /> width:22px;<br /> height:22px;<br /> vertical-align:bottom;<br /> }<br /> #colorselections{zoom:1} <br /> #colorselections a.on {<br /> border:2px solid #d5680d;<br /> }<br /> #previewer {<br /> margin:26px 0 20px 0;<br /> padding:6px;<br /> clear:left;<br /> font:bold 19px/25px Verdana;<br /> border:1px solid #ccc;<br /> width:80%;<br /> }<br /> <br /> $(function(){<br /> $("#inputText").keyup(function(){<br /> $("#previewer").empty();<br /> $("#previewer").text($(this).attr("value"));<br /> });<br /> });<br /> $(function(){<br /> $("#colorselections a").click(function(){<br /> $(this).addClass("on").siblings().removeClass("on");<br /> $("#previewer").css("color",$(this).css("background-color"))<br /> });<br /> });<br /> 璇疯