- 综合排序
- 最热优先
- 最新优先
- 来自专栏全栈程序员必看
YUI3 入门
调用方法： 既然我们是使用的YUI这个js库，那么肯定第一步就是引用这个文件，刚才在上面已经说了我们要使用的是yui-min.js这个文件，当然你可以对他进行改名，你只需要到你下载的yui库的文件中找到他 后面的地址请根据实际情况填写，当然你也可以使用官方提供的地址，请看： <script src=”http://yui.yahooapis.com/3.0.0pr2/build/yui/yui-min.js 实现我们的功能 当我们已经调用好Yui这个js库以后，接下来就得看我们自己的了，如何通过Yui来实现我们想要的功能呢，嘿嘿，请看： 1、Yui 3最基本的使用格式： YUI().use(”node”, function(Y) { // 书写你的js代码 }); 就是要使用Yui 3提供的方法，就必须得将他们写在上面这个大括号之内，不然无法使用。 在Yui 3的get方法中也是这样的。
83440编辑于 2022-09-14 - 来自专栏全栈程序员必看
yui3：widget
为了达到这个目的： YUI在<HTML>元素上添加一个class名 “yui3-js-enabled”； 然后，开发者可以在widget的内容上添加class名 “yui3-widget-loading ”，代表加载中状态； 这个class名可以和“yui3-js-enabled”一起使用，在JavaScript正在加载时隐藏widget的内容. .yui3-js-enabled .yui3-widget-loading 比如：对于继承于Slider的MultiThumbSlider类，在bounding box上会标记“yui3-widget”、“yui3-slider”和“yui3-multithumbslider” 常用格式如下：“yui3-[widgetname]-[state]”。比如：“yui3-slider-hidden”、“yui3-slider-disabled”。 默认的格式是：“yui3-[widgetname]-content”。如“yui3-slider-content”。
1.9K20编辑于 2022-09-14 - 来自专栏全栈程序员必看
YUI3的几点说明
YUI3的几点说明 YUI3是一个重量级的前端框架库,它提供了单元测试(YUITest)，生成文档(YUIDoc)，自动化编译(YUI Build)等工具，在代码组织方面有统一的微件(widget) alloyUI 是基于YUI3创建的一个UI库,提供了许多常用的UI组件和简单的api.我的例子也是在alloyUI基础上做出 来的. 关于例子的一些说明 因为时间仓促,以及本人也是刚刚接触YUI的缘故.所以这个例子非常简单. 主要展示了一个表单的布局,校验,加载和提交数据.以及一些比较常用的UI组件. 上的一个扩展(gallery),YUI上的扩展接近200来个.还有许许 多多的公司和开发者在为其贡献代码.我们自己也可以动手,在YUI3的基础上来扩展. 前端技术平台的问题，我倾向于慎重考虑几个问题后再做选择： 我们要做什么，具体要达到什么目标 开源的框架选择了以后，我们能不能驾驭它，成本风险评估如何 可行性方案(个人意见): 基于YUI3的widget
1.1K40编辑于 2022-09-07 - 来自专栏全栈程序员必看
yui java 右键_给YUI Compressor添加右键命令,完成快捷压缩
YUI Compressor默认不带右键安装功能 YUI Compressor非常好用，特别是JS的混淆是众多JS Coding的最爱。 可惜官网提供的版本都不具备右键功能，每次压缩都要cmd输入一些命令实在是繁琐，本文就介绍如何给YUI Compressor添加右键命令，方便使用。 于是只好自己摸索，下面写出添加添加右键过程，适合任何YUI Compressor版本。 安装步骤 一、下载YUI Compressor任何你想使用的版本，这里我下载最新版本2.4.7版本。 Compressor] [HKEY_CLASSES_ROOT\AllFilesystemObjects\shell\YUI Compressor\command] @=”D:\\yuicompressor 右键js文件，弹出的菜单里，有一个 YUI Compressor选项，单击它对选中的文件压缩 正常的压缩命令提示 压缩后生成的文件，以及大小对比。
70030编辑于 2022-09-09 - 来自专栏全栈程序员必看
YUI 3 学习笔记：loader
YUI 3 的 loader 已经很优雅地融合在YUI(config).use('moduleName', callback)中： YUI({ base: 'http://t-yubo/assets /yui/3.0.0/build/', debug: true, filter: 'debug', modules: { jquery: { fullpath jquery/1.3/jquery.min.js' } } }).use('jquery', 'node', function(Y) { jQuery('body').text('YUI ; }); config参数，在 yui-base 模块里，原封不动地传给了 Loader： // use loader to expand dependencies and sort the // requirements 将 YUI 自带的所有 modules 信息，存放在一个很大的数据对象里： modules = { moduleName: { requires: [...],
47730编辑于 2022-09-13 - 来自专栏全栈程序员必看
YUI3 使用总结
YUI3总体认识 1.1 面向对象的JS编程，RIA工具： 面向对象的JS编程，主要体现的以下几个方面： 1． 接口和抽象类 YUI3 oop的argument（）可以实现类似的功能 4． 模块之间的引用，即代码复用 YUI3的沙箱模型，可以使JS模块化，在Y.use中引入，可以实现代买复用 1.2 重量级框架，oop思想 YUI3中的oop模块就是面型对象编程的重要体现 1.3 YUI3 API使用 点击YUI3 的web site后能看到他的详细结构： 学习他的ＡＰＩ就应该从这个开始： 第一列就是一些帮助文件信息，还有一些辅助开发工具，我用过的也就是Ｃｏｎｓｏｌｅ了， 这个就是他的这个全局的YUI Global Object 所用到的模块。
94030编辑于 2022-09-14 - 来自专栏小狼的世界
学习使用YUI3
以下只是在YUI学习和使用中零碎的一些心得体会，未成体系，发出来，供批判。 1、利用 Font、Base、Grid CSS进行快速的网页布局。 对YUI一直很有好感，最近开始看了看YUI CSS GRID，发现这个理念非常好，非常有利于我们工作效率的提高，特别是熟悉了这套CSS之后，我们就不必每一个项目自己都去写一些CSS。 但是YUI CSS GRID在YUI3中已经不被推荐使用，我为此感到惋惜和不解。不过幸好，及时不被推荐，我们仍可在项目中使用他。 2、 IO的使用。 这个在YUI的论坛里有人反映了，是一个bug，已经解决，但是官方的那个build还没有更新。 4、YUI Library 5、YUI Loader 学习笔记
74920发布于 2018-07-25 - 来自专栏小狼的世界
如何开发YUI3的扩展
YUI是Yahoo发布的一个JS框架，虽然不如jQuery简单，但是如果你是要做一些复杂的事情的时候，有一个合适量级的框架还是能有用不少。 YUI3中的一些定义。 Module。 YUI3中的每块代码都可以看作是一个Module。 通过引入Seed文件后，由YUI框架自动调入。 1: <script src=”http://yui.yahooapis... /yui-min.js”></script> 2: 3: <script src=” http://yui.yahooapi... 在YUI实例化时，YUI()方法中可以接收多个配置项，例如YUI(c1,c2,,,)。 1: <script src=”http://yui.yahooapis...
1.4K10发布于 2018-07-25 - 来自专栏小狼的世界
YUI3 CSS框架学习
YUI3的CSS与YUI2的CSS不同 改变最大的我觉得是Grids部分，YUI2中以模版的方式提供给我们调用，功能中多选项也很多，而且配合Grid Build Tool，可以快速的生成复杂的页面结构。 YUI3 Reset YUI3的Reset同YUI2.8中的Reset有些区别，在YUI3的CSS Reset中，我们可以对所有HTML资源重设其表现，以达到不同浏览器下的一致表现（Page Level YUI3 Fonts 在YUI2的Fonts中，使用em来表示文字的大小。但是在YUI3中，这一规则被打破了，改为使用百分比来表示文字的大小。如下表，这样的表达方式对于平时的书写来说，是不太友好的。 YUI3 Grids 习惯了YUI2中的Grids System之后，初次转换到YUI3中非常不习惯。因为YUI2提供了一个非常强大的工具（YUI Css Grid Builder）。 参考资料： 1、YUI3 CSS Reset 2、YUI3 CSS Fonts 3、YUI3 CSS Grids 4、YUI3 Alignment Example Page 5、YUI3 Grids Are
83730发布于 2018-07-25 - 来自专栏小狼的世界
YUI3 Overlay的使用
最简单的引用YUI3的方法自然是引用Yahoo服务器上的种子文件，地址如下： <script src="http://<em>yui</em>.yahooapis.com/3.0.0/build/<em>yui</em>/<em>yui</em>-min.js "></script> 引用了种子文件之后，我们就可以在我们的应用中使用Overlay了，建立一个新的YUI的命名空间，如下： YUI().use(‘overlay’,function(Y){ 使用overlay也好，其他的yui特性也好，感觉非常的方便和灵活，可以说是一个真真正正为开发者考虑的js框架，而我们也应该学习YUI3的这种设计思想和风格，让自己的应用也变得更加灵活和方便。 总体来看，目前YUI3的Overlay基本能够满足我们日常创建一些叠加层的需要，但是还有一些更高级的属性或者控制功能期待在后续的版本中加入进来。 Technorati Tags: YUI3,Overlay,浮动层 参考资料： 1、YAHOO YUI3 Overlay
61330发布于 2018-07-25 - 来自专栏全栈程序员必看
YUI3学习（一）—入门
YUI3在前身YUI2基础上进行了大量的重新设计，并不只是简单的版本升级。YUI3强调代码重用，将功能做了级别划分和颗粒化的设计。 YUI 3重点是代码的组织和结构。以下是结构图。 YUI3在结构上分为四大类： 种子：该模块是YUI3的单一核心，页面都必须包含该模块，该模块提供加载功能，所以可以堪称是YUI的一个种子。 在YUI3中扮演引导层的作用，通过在页面引入种子相关文件，调用YUI().use()方法可以安全快速的加载YUI3核心类和组件类。 包含YUI Base、Get和Loader模块。 YUI3学习路线 目前关于YUI3的中文资料并不多，也未发现一本介绍YUI3的书籍。 <script type="text/javascript" src="build/<em>yui</em>3/<em>yui</em>/<em>yui</em>-min.js"></script> 之后嵌入脚本，验证YUI3是否调用成功 YUI({filter
1.3K10编辑于 2022-09-14 - 来自专栏全栈程序员必看
Maven压缩插件YUI Compressor使用介绍
简介 这篇文章主要介绍了Maven压缩插件YUI Compressor使用介绍以及相关的经验技巧，文章约18810字，浏览量165，点赞数5，值得参考！ 使用说明: 使用YUI Compressor压缩JS和CSS。 需要Maven2.0及以上工程。 默认情况绑定到构建生命周期：process-resources。 默认值：false gzip boolean 请求创建yui 压缩/ 聚合文件的gzip压缩版本。默认值：false jswarn boolean [js only]显示代码中可能存在的错误。
1.1K30编辑于 2022-09-09 - 来自专栏全栈程序员必看
YUI Compressor完成代码混淆示例「建议收藏」
---- YUI Compressor相关信息 官网 GitHub地址 ---- 混淆单个js 一般命令， java -jar yuicompressor-x.y.z.jar myfile.js -o invalid property id 该文件的第110行内容是float: false,， 参照Stack Overflow–Compression issues with JQuery file in YUI Compressor，由于float同时是js和css的关键字，故YUI会将其区分不开，需改为"float": false,。
66520编辑于 2022-09-09 - 来自专栏小狼的世界
使用YUI3创建Popup弹出层
YUI3是一个非常好的开源框架，但是学习曲线稍微有些陡峭，这个系列将记录下我使用YUI3过程中的一些心得点滴，希望对大家能够有帮助。 很多互联网的项目应用中，弹出层出现的越来越多，使用YUI3可以快速的实现制作弹出层的效果。 YUI3提供了Overlay这个组件来实现可定位、可叠加的弹出层效果，这个弹出层同时还包含标准的布局模块。 <script type="text/javascript" charset="utf-8" src="http://<em>yui</em>.yahooapis.com/3.1.1/build/<em>yui</em>/ <em>yui</em>-min.js"> </script> 之后，我们就可以创建YUI的实例了。 YUI().use(“overlay”, function(Y){ }); 传给use最后的一个参数是一个回调函数。该回调函数在YUI实例完成了页面中缺少的文件加载后开始执行。
82710发布于 2018-07-25 - 来自专栏全栈程序员必看
YUI3 Overlay的使用「建议收藏」
最简单的引用YUI3的方法自然是引用Yahoo服务器上的种子文件，地址如下： <script src="http://<em>yui</em>.yahooapis.com/3.0.0/build/<em>yui</em>/<em>yui</em>-min.js "></script> 引用了种子文件之后，我们就可以在我们的应用中使用Overlay了，建立一个新的YUI的命名空间，如下： YUI().use(‘overlay’,function(Y){ 使用overlay也好，其他的yui特性也好，感觉非常的方便和灵活，可以说是一个真真正正为开发者考虑的js框架，而我们也应该学习YUI3的这种设计思想和风格，让自己的应用也变得更加灵活和方便。 总体来看，目前YUI3的Overlay基本能够满足我们日常创建一些叠加层的需要，但是还有一些更高级的属性或者控制功能期待在后续的版本中加入进来。 Technorati Tags: YUI3, Overlay, 浮动层 参考资料： 1、YAHOO YUI3 Overlay 发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn
40940编辑于 2022-09-13 - 来自专栏小狼的世界
封装内容和功能 – YUI TabView使用小记
本文主要内容取自 Caridy Patino 在2008年发布的文章,原文中使用的是YUI2，笔者对例子做了一些更新，均使用了YUI3.1.1，文章中讨论的这个问题，在Ajax满天飞的现在具有典型意义 例如，在使用YUI的情况下： 构建页面DOM： 构建符合要求的页面DOM（当然我们也可以使用YUI来动态的创建DOM，但这样就丧失了搜索引擎友好的特性）。 Instance YUI({base:'.. <script type="text/javascript"> //Create YUI Instance YUI({base:'.. 4、YUI Plugin
67320发布于 2018-07-25 - 来自专栏Java架构师必看
YUI3在美团的实践
在应用YUI3的过程中，我们团队积累了一些经验，这里总结成篇，分享给大家。 为什么选择YUI3 使用什么前端基础框架是建立前端团队最重要的技术决策之一。 但早在2008年8月13日，YUI3 Preview Release 1中就已经给出了YUI团队的解决方案，并在2009年9月29日YUI3正式版发布时定型。 为了实现自动加载，需要将所有模块的元信息提供给YUI的Loader。 最初，为了更快的从YUI2迁移到YUI3，模块元信息放在PHP中进行维护。随着时间的推移，渐渐显示出很多弊端。 通过不断的实践，我们越发认为这是YUI3的精髓所在。 行进中开火 在整个YUI3的实践中，我们犯过很多错误，例如全局只有一个YUI实例、Combo的CSS图片依赖等等，但这些并没有成为放弃的理由。
1.1K30发布于 2020-04-10 - 来自专栏全栈程序员必看
网站优化工具-YUI Compressor「建议收藏」
一、简介 YUI Compressor，专用于压缩js和css文件，可以有效降低js和css文件占用的空间； 如，将使用YUI Compressor压缩过的js和css文件部署到网站的生产环境，有效降低浏览器下载相关资源的时延 二、压缩工具YUI-Compressor 英文官网：http://yui.github.io/yuicompressor/ GitHub-YUI:https://github.com/yui/yuicompressor 在线YUI：http://ganquan.info/yui/? hl=zh-CN YUI compressor的一个缺点是基于JAVA，首先得需要有一个JRE才可以运行， 使用YUI压缩，首先需要准备YUI的jar包 下载地址： http://download.csdn.net +x /opt/software/yuicompressor/yui.sh 5.建立链接 sudo ln -s /opt/software/yuicompressor/yui.sh /usr/bin/
96020编辑于 2022-09-09 - 来自专栏小狼的世界
YUI Grids实现自定义宽度的Template
也许有些人不喜欢用YUI的CSS，但是我觉得这个对我来说，简直是太方便了，特别是如果你赞同Yahoo的栅格理论的话，YUI Css几乎可以用在你所有的项目上。 但是也有缺陷，YUI预设的Template中只为我们提供了六种预设的模板，并没有像整个页面那样提供一个可以自定义的标签，那么当我们的需求需要实现不同的宽度的时候，就只有自定义了，我的目标是实现一个符合yui-t #doc,#doc2,#doc3,#doc4,.yui-t1,.yui-t2,.yui-t3,.yui-t4,.yui-t5,.yui-t6,.yui-t7 { margin:auto;text-align ; min-width:750px; } .yui-t-custom #yui-main { float:left; margin-right:-25em; } .yui-t-custom .yui-b { float:right; width:26.92em; *width:26.25em; } .yui-t-custom #yui-main .yui-b { margin-right
42230发布于 2018-07-25 - 来自专栏小狼的世界
YUI学习笔记 – CSS Rest、Base、Font以及Grid
YUI这几个CSS存在于两个版本的YUI中（YUI2和YUI3）。本文的介绍以YUI3版本为例。 1、YUI3 Css Reset。 YUI3的Css Reset还提供了局部的Reset样式的功能，在我们想对某一容器内的元素（而不是整个页面）进行样式统一时使用。 2、YUI3 Css Base。 YUI3 Css Grids中对于命名规则进行了改变，这与YUI2 Css Grids中有很大的不同。不过基本原理还是一样的熟悉了任何一个，就能够方便快速的进行页面的布局。 当然，现在YUI3的Css Grids还在Beta阶段，还不是太完善，如果我们需要一个成熟的解决方案，可以考虑使用YUI2的Css Grids，使用YUI2的Css Grids并不会影响我们使用YUI3 的框架，他只是一个样式表嘛 :) 参考资料： 1、YUI CSS Reset 2、YUI CSS 3、A-Grade Browsers
68640发布于 2018-07-25
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号