`

jQuery 调整字体大小详解 (firefox)

阅读更多

<!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="Content-Type" content="text/html; charset=gb2312" />
<title>JQuery css函数测试</title>


<script src="jquery-1.2.6.js" type="text/javascript"></script>              //导入jquery

<script type="text/javascript">


$(document).ready(function(){


   $('div .button' ).click(function(){                             //注意之间有空格代表div 下有class为button的


    var $duanluo=$('div.speech' );  //jQuery 变量 存储段落信息   div.speech注意之间没有空格 当然.speech也行


      
      var ziti=$duanluo.css('fontSize');                       //字体信息  大小 如:8px
      
      //alert(ziti);测试结果ziti是  8 px

      
      var ztdx=parseFloat(ziti,10) ;       //取以字母开头的字符串为     10   (第二个参数)  进制数字
      
     //alert(ztdx);

      var unit= ziti.slice(-2);               //取字体信息的  单位 如:8px 中的px  slice取字符串 从倒数第二个开始取
      
   
      if (this.id=='switcher-large'){ztdx *= 1.4;}
      else if (this.id=='switcher-small'){ztdx/= 1.4;}


  
$duanluo.css('fontSize', ztdx + unit);     //段落的css应用处理后的字体大小
  });
});
</script>






</head>
<body>
<center><h1>JQuery css函数测试</h1></center>

 

<div id="switcher">


    <spent class"label"> Stryle Switcher:</spent><br>                 //spent默认在同一行上所以用 <br>
    <spent class ="button" id ="switcher-large" > + 加大 +  </spent><br> //用<div也行>
    <spent class ="button" id ="switcher-small" > - 减小 - </spent>

</div>    


<div class ="speech" >
<p>
<b>jQuery是一个了不起的javascript库,它可以是我们用很少的几句代码就可以创建出漂亮的页面效果。</b>
</p>
</div>

</body>
</html>

  • JQtt.rar (29.4 KB)
  • 描述: 源代码!没啥好说的 (@ _ @)
  • 下载次数: 49
4
1
分享到:
评论

相关推荐

    jQuery 3D文字

    "-moz-transform": "rotateX(45deg) rotateY(30deg)", // 对于Firefox "-ms-transform": "rotateX(45deg) rotateY(30deg)", // 对于Internet Explorer "-o-transform": "rotateX(45deg) rotateY(30deg)" // 对于...

    Jquery UI Customer-1.10.3

    jQuery UI 1.10.3 版本考虑了跨浏览器兼容性,支持主流的现代浏览器如 Chrome、Firefox、Safari、IE 等。同时,它致力于优化性能,确保组件在各种设备上运行流畅。 总结,jQuery UI 1.10.3 是一个功能丰富的 UI ...

    最新JQuery UI 1.8.2 内含实例及Jquery 1.4.2

    - jQuery UI 1.8.2 支持多种浏览器,包括 IE6+、Firefox、Chrome、Safari 和 Opera,确保广泛的应用场景。 - 移动设备支持:虽然主要针对桌面环境,但通过适配和响应式设计,也可在移动设备上运行。 总结来说,...

    jquery barcode js 包+示例

    5. **兼容性好** - 兼容主流的浏览器,包括 Chrome, Firefox, Safari, Edge 和 IE10 及以上版本。 **使用步骤:** 1. **引入库文件** - 首先需要在页面中引入 jQuery 和 `jQuery Barcode` 库的 JavaScript 文件。 ...

    关于jQuery-Ui的引用文件

    jQuery UI 支持多种浏览器,包括 Chrome、Firefox、Safari、Edge 和 Internet Explorer。对于性能优化,可以考虑按需引入组件,减少不必要的加载负担。例如,如果只需要使用 Dialog 功能,可以只引入 Dialog 相关的 ...

    JQuery虚拟键盘插件

    1. **多浏览器兼容性**:该插件经过优化,能够在包括Chrome、Firefox、Safari、Edge、IE10及更高版本在内的主流浏览器中正常运行,确保了广泛的用户覆盖。 2. **拖动功能**:虚拟键盘可以被设计成可拖动,这意味着...

    jQuery Select(单选) 模拟插件 V1.3.6

    作为一款基于jQuery的插件,"jQuery Select(单选) 模拟插件 V1.3.6"应当兼容大部分现代浏览器,包括Chrome、Firefox、Safari、Edge等。然而,对于老版本的IE浏览器,可能需要确保已安装了jQuery的兼容库。 ### 6. ...

    jquery-ui-1.8.6

    6. **兼容性**:jQuery UI 1.8.6 支持多种浏览器,包括Internet Explorer、Firefox、Chrome、Safari和Opera,确保了广泛的用户覆盖范围。 7. **国际化支持**:对于需要多语言支持的项目,jQuery UI 提供了国际化的...

    Jquery UI 1.11.2

    - jQuery UI 1.11.2 支持现代浏览器,如Chrome、Firefox、Safari、IE9及以上版本。 - 对于旧版本的IE浏览器(如IE6-8),可能需要借助jQuery的兼容库(如jQuery migrate)来确保功能正常运行。 6. **示例与文档**...

    jqueryflowtext是一款简单实用的jQuery响应式文字插件

    `jQuery Flowtext` 主要依赖于 jQuery 库,因此其兼容性与 jQuery 相同,支持大部分现代浏览器,包括 Chrome、Firefox、Safari、Edge 和 IE9 及以上版本。然而,由于其基于 JavaScript 实现,对于移动设备和低性能...

    JQuery UI1.7中文文档

    jQuery UI 1.7 针对各种浏览器进行了优化,确保在IE6+、Firefox、Chrome、Safari和Opera等主流浏览器上表现良好。同时,遵循WAI-ARIA标准,提高了无障碍访问性。 ### 7. **示例与文档** jQuery UI 1.7 的中文文档为...

    jquery 教程

    2. **兼容性**: jQuery支持多种现代浏览器,包括Internet Explorer 6.0+、Firefox 1.5+、Safari 2.0+ 和 Opera 9.0+,确保了跨浏览器的一致性和稳定性。 3. **易于扩展**: 用户可以根据需要轻松地扩展jQuery的功能,...

    jquery-ui工具类

    jQuery UI 支持多种浏览器,包括IE6+、Firefox、Chrome、Safari和Opera。然而,随着技术的发展,对于旧版本浏览器的支持可能逐渐减少。在开发时,应注意现代浏览器的最佳实践,并考虑使用polyfills或渐进增强策略来...

    JQuery Mobile需要的包

    jQuery Mobile 支持主流的现代浏览器,包括Chrome、Firefox、Safari以及IE9+。对于旧版浏览器,需要考虑兼容性问题。同时,选择合适的jQuery Mobile版本至关重要,新版本通常包含更多特性,但可能不支持较旧的设备。...

    jquery.msgbox.5.0.rar

    作为一款成熟的jQuery插件,它已经在各大主流浏览器,如Chrome、Firefox、Safari、Edge以及Internet Explorer 8及以上版本进行了广泛的测试,确保在这些环境中都能正常运行。这使得开发者无需担心因浏览器兼容问题而...

    jQuery控件简易日历表格代码.zip

    本文将详细介绍名为"jQuery控件简易日历表格代码"的实现方式,以及其在不同浏览器(如Firefox、Chrome和IE)中的兼容性。 首先,让我们理解jQuery的基本概念。jQuery是JavaScript的一个库,它简化了DOM操作、事件...

    jquery-ui-1.8.12.custom.zip

    这个版本的jQuery UI兼容多种浏览器,包括IE6及更高版本,Firefox,Chrome,Safari和Opera。同时,对DOM操作和事件处理进行了优化,提高了性能。 6. **使用步骤**: - 下载并解压`jquery-ui-1.8.12.custom.zip`,...

Global site tag (gtag.js) - Google Analytics