jquery 实现的改变颜色与背景的代码 change(fontsize,background)补充2

change(fn)
在每一个匹配元素的change事件中绑定一个处理函数。
change事件会在元素失去焦点的时候触发，也会当其值在获得焦点后改变时触发。

豪情

p{line-height:23px;margin:0;padding:0;}

$(function(){
$('#c-obj select').change(function(){
alert($(this).attr('id') + ': ' + $(this).val());
$('p').css($(this).attr('id'), $(this).val()); //select的ID和要设置的CSS属性值必须保持一致
});
});

change(fn)

在每一个匹配元素的change事件中绑定一个处理函数。

change事件会在元素失去焦点的时候触发，也会当其值在获得焦点后改变时触发。

字体大小

小号
较小
中号
较大
大号

背景颜色

默认
淡灰
红色
绿色
明黄

字体颜色

黑色
红色
绿色
蓝色
棕色

春江花月夜

春江潮水连海平，海上明月共潮生。滟滟随波千万里，何处春江无月明。

江流宛转绕芳甸，月照花林皆似霰。空里流霜不觉飞，汀上白沙看不见。

江天一色无纤尘，皎皎空中孤月轮。江畔何人初见月？江月何年初照人？

人生代代无穷已，江月年年只相似。不知江月待何人，但见长江送流水。

白云一片去悠悠，青枫浦上不胜愁。谁家今夜扁舟子？何处相思明月楼？

可怜楼上月徘徊，应照离人妆镜台。玉户帘中卷不去，捣衣砧上拂还来。

此时相望不相闻，愿逐月华流照君。鸿雁长飞光不度，鱼龙潜跃水成文。

昨夜闲潭梦落花，可怜春半不还家。江水流春去欲尽，江潭落月复西斜。

斜月沉沉藏海雾，碣石潇湘无限路。不知乘月几人归，落月摇情满江树。

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

Jquery change(fontsize,background) 改变颜色与背景的代码

赞 (0)

相关推荐

  • jQuery animate()实现背景色渐变效果的处理方法【使用jQuery.color.js插件】

    jQuery animate()实现背景色渐变效果的处理方法【使用jQuery.color.js插件】

    本文实例讲述了jQuery animate()实现背景色渐变效果的处理方法.分享给大家供大家参考,具体如下: jquery animate函数不能处理背景色渐变,需要使用jquery.color插件 核心代码: $(function(){ $("#cdiv").animate( { backgroundColor:'#FF0000' },1000 ) }) 完整代码如下: <!DOCTYPE html> <html> <head> <meta

  • jQuery与js实现颜色渐变的方法

    本文实例讲述了jQuery与js实现颜色渐变的方法.分享给大家供大家参考,具体如下: 1.目的 本来想的是 提示用户应该点某个按钮 这个功能,就想着让这个按钮div的边框变成醒目的颜色然后逐渐变白. 在网上搜了搜,本来想使用jQuery的animate,后来发现这个方法只能用来进行长度的渐变.还有就是需要下载jQuery的颜色渐变插件来实现,感觉挺麻烦的,就自己用土办法实现了. 2.原理 先获得初始颜色的rgb,再获得终止颜色的rgb,使用rgb三个数字的差值,从初始颜色的rgb逐渐过渡到终止颜

  • Jquery的hover方法让鼠标经过li时背景变色

    Jquery的hover方法让鼠标经过li时背景变色

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

  • 用jquery实现点击栏目背景色改变

    用jquery如何实现点击一栏目实现栏目变色,再点击另一栏目也变色,但原来的变回原色,我有个数组a(1,2,3,我循环遍历输出a的值. 复制代码 代码如下: <ul> <li><a onclick="show();"><b>a[0]<b><a></li> <li><a onclick="show();"><b>a[1]<b><a&

  • jQuery 行背景颜色的交替显示(隔行变色)实现代码

    一些css的定义,可以根据需要自己选择.//显示单双行显示不同背景色[方法一]: // $("#UL_id li:even").attr("className","redClass"); //显示单双行显示不同背景色[方法二]: $("#UL_id li:even").addClass("redClass"); <ul id="UL_id"> <li>单数<

  • jquery实现动画菜单的左右滚动、渐变及图形背景滚动等效果

    jquery实现动画菜单的左右滚动、渐变及图形背景滚动等效果

    本文实例讲述了jquery实现动画菜单的左右滚动.渐变及图形背景滚动等效果.分享给大家供大家参考.具体如下: 这里演示基于jquery实现的动画菜单,内含四种效果的网站菜单,第一种是不带效果的传统导航菜单,第二种是带有图形滚动背景的菜单,第三种是由右向左背景滚动的菜单,第四种则是背景色渐变的网站菜单,每一种都很精彩,喜欢Js菜单的可模仿借鉴一下. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-flash-style-cha-men

  • jQuery实现的文字hover颜色渐变效果实例

    本文实例讲述了jQuery实现的文字hover颜色渐变效果.分享给大家供大家参考,具体如下: <html> <head> <script type="text/javascript" src="jquery-1.6.2.min.js"></script> <script type="text/javascript" src="jquery-ui-1.8.16.custom.min.j

  • jQuery实现的立体文字渐变效果

    先截两个图看看: 效果很不错吧?会不会误以为这些字体是图片?这可不是图片,而是用JS实现的 在线演示 http://demo.jb51.net/js/gradient-test/demo.htm 下面来简单分享下实现过程及原理(网站中使用了jquery这个lib,我们这里就不再自己单独实现了,我们这里分享的也是jquery的实现方法): HTML代码: 复制代码 代码如下: <span class="rainbows">© 2009 Dragon Interactive.

  • jQuery实现鼠标滑过Div层背景变颜色的方法

    本文实例讲述了jQuery实现鼠标滑过Div层背景变颜色的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <title>jQuery实现感应鼠标经过Div层变换图层背景颜色)</title> <style type="text/css"> .divbox{   height:300px;   width:200px;   background:#ffffff;   border

  • jquery改变tr背景色的示例代码

    id为tr的ID 设置当前选择行背景色,同时置其他行背景为另一种颜色 复制代码 代码如下: $('#id').css("background-color", "#e5e5e5").siblings().css("background-color", "#FFFFFF");

  • jquery实现两个图片渐变切换效果的方法

    本文实例讲述了jquery实现两个图片渐变切换效果的方法.分享给大家供大家参考.具体如下: 这段代码演示了jquery如何实现两个图片渐变切换的效果,为id=kitten的div设置一个背景图片,通过jquery对div进行淡入淡出实现两个图片的渐变切换 html代码 <div id="kitten"> <img src="/images/kitten.jpg" alt="Kitten" /> </div> j

随机推荐