网络生活——关注网络，关注前端设计

在网页设计中经常由于客户的种种需求，而需要DIV层和FLASH的交互，但是往往DIV都被FLASH遮盖住了。

过去参与的一个项目：http://www.digitalwuhan.gov.cn/index.html（该网站问题多多就不说了，各位就不用批网站的问题了，现在只讨论本论题。）

顶部的flash就涉及此问题，具体是怎么解决的呢？因为今天看到有人提出此问题，就把解决方案拿出来分析一下。

先看该网站的FLASH加载代码：

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" name="red1" width="1003" height="218" align="middle" id="red1">
     <param name="allowScriptAccess" value="sameDomain" />
     <param name="movie" value="images/top_blue.swf" />
     <param name="quality" value="high" />
     <param name="wmode" value="transparent" />
     <param name="bgcolor" value="#ffffff" />
     <embed src="images/top_blue.swf" quality="high" wmode="transparent" bgcolor="#ffffff" width="1003" height="218" name="red1" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>

主要起作用的就是用红色和绿色标注的这两句，其中红色的<param name="wmode" value="transparent" />这句主要用于IE下的效果实现，绿色的wmode="transparent"则是Firefox下效果实现的代码。

附加资料：

关于wmode属性资料：

（可选）允许使用 Internet Explorer 4.0 中的透明 Flash 内容、绝对定位和分层显示功能。此标记/属性仅在带有 Flash Player ActiveX 控件的 Windows 中有效。

"Window"在 Web 页上用影片自己的矩形窗口来播放应用程序。"Window"表明此 Flash 应用程序与 HTML 层没有任何交互，并且始终位于最顶层。

"Opaque" 使应用程序隐藏页面上位于它后面的所有内容。

"Transparent"使 HTML 页的背景可以透过应用程序的所有透明部分显示出来，并且可能会降低动画性能。

"Opaque windowless"和"Transparent windowless"都可与 HTML 层交互，从而允许 SWF 文件上方的层遮蔽应用程序。这两种选项之间的差异在于"Transparent"允许透明，因此，如果 SWF 文件的某一部分是透明的，则 SWF 文件下方的 HTML 层可以透过该部分显示出来，而"opaque"则不会显示。

如果忽略此属性，默认值为 Window。仅适用于 object。

最后更新：2009-2-16

好久没更新博客了，今天看到一篇文章和我一直以来的看法比较接近，转发上来共享。

PHP的主要语言开发者之一、Zend公司的创始人之一Andi Gutmans最近在blog中直言不讳地批评了Java语言。他指出，目前Java厂商试图在JVM上提供动态语言实现的路子根本不对，Java已经输掉了Web开发语言的战争，PHP是事实上的标准和胜利者。

　　Gutmans的这篇文章在技术界引发了强烈争议，很对人对此有不同的意见，我在这里就阐述一下我对PHP和Java两种语言的看法。

　　我早先曾经在《Perl、PHP、ASP、JSP技术比较》 一文中对比过PHP和Java的异同，简而言之，PHP是一种解释执行的脚本语言，语法和C语言类似，易学易用，不懂电脑的非专业人员稍经学习也能使用 PHP.而Java要先编译成Class文件，然后在Java虚拟机上执行，Java开发需要熟悉Java语法以及一些核心的架构，从而实现一种可复用 的、跨平台的软件，Java比PHP要难学的多。

　　实际上，从技术架构来说，Java语言相比PHP有明显的优势，Java使用的是面向 对象的系统设计方法，而PHP还是采用面向过程的开发方法。PHP只能实现简单的分布式两层或三层的架构，而JAVA可以实现多层架构。数据库层（持久化 层）、应用（业务）逻辑层、表示逻辑层彼此分开，而且现在不同的层都已经有一些成熟的开发框架的支持。例如Struts就是利用Java的web开发技术 实现了MVC的设计模式，而在业务逻辑层也有Spring框架，数据库持久化层有Hibernate等框架。这些框架可以方便开发者高效、合理、科学得架 构多层的商业应用。从数学运算和数据库访问速度来讲，Java的性能也优于PHP.实际上，对于跨平台的大型的企业应用系统来讲，Java几乎已经成为唯 一的选择（微软.NET不支持跨平台），但是在于Web网站应用开发来讲，Java却面临着被PHP边缘化的危险，几乎所有的虚拟主机都支持PHP+ MySQL，而支持Java的却少之又少，在资源上，网上有不计其数的PHP资源，很多著名的大型网站（例如Facebook、Mediawiki等）都 是基于PHP的，而成功的Java网站却寥寥无几，这又是什么原因呢？

　　Java的理念是“一次编写，到处运行”，Java在应用框架底 下的架构是无与伦比的，远胜过其他任何语言，Java的框架利于大型的协同编程开发，系统易维护、可复用性较好。而PHP很容易自学，让热备能快速简洁地 编写代码，适合于快速开发，中小型应用系统，开发成本低。在调试、发布上，PHP也较Java简单。

　　理念上的不同导致了Java和 PHP在Web应用开发上显示了不同的结果，尽管Java的数学计算和数据库访问都有优势，架构也相当完美，但是PHP却可以简单轻松地支持高强度Web 访问，能够快速开发应用，支持PHP的虚拟主机多如牛毛，使得用PHP开发一个网站比用Java开发一个网站要快得多，容易的多。Java所拥有的优点只 适合传统的以软件项目为核心的开发模式，而PHP更适合于以客户为核心的SaaS的开发模式，因此，PHP目前在Web网站开发的优势完全是因为Web网站开发的特殊性而导致的，并非编程语言特性所决定。

　　因此，PHP在Web网站开发语言的战争中已经慢慢将Java抛在了后面，Java要想在Web网站开发上奋起直追，的确应该多听听Andi Gutmans的意见，彻底改变一下思路才行，否则两者的差距只能是越来越远。

　 　另外，虽然在国际上LAMP（Linux+Apache+Mysql+Php）架构已经占领了统治地位，但是在中国国内还有一个怪胎，就是基于微软的 Windows Server+IIS+SqlServer+ASP/ASP.NET的架构，从理论上说，微软的这一套架构也能实现不错的性能，只可惜Windows和 SqlServer价格不菲，整个架构在性能上比起LAMP不仅没有什么优势，反而还有不少劣势，因此微软的这一套家伙在国际市场上吃不开。而国内使用微 软盗版则可以忽略成本，而ASP的易学易用性不逊于PHP，甚至连IT外行都能够使用，因此在国内也有不小的市场。但是随着中国在保护知识产权方面的日趋 完善，免费的LAMP依旧是未来的趋势。

 

二级dropdown弹出菜单.html

三级dropdown弹出菜单.html

flyout-竖向三级弹出菜单.html

水平三级横向弹出菜单.html

水平竖弹向上三级弹出菜单.html

在网上看到一篇不错的译文，很系统的讲述了写样式时可以如何写得“漂亮”，文中也提到关于样式的管理，这也是我花了很长时间在总结的事，看了这篇文章后，还真有自己动手整理出来的冲动，:) 还是先看看文章吧。

原文名称:Creating Sexy Stylesheets
原文地址: http://www.thinkvitamin.com/features/design/creating-sexy-stylesheets

作为一个CSS方面的专家,所做的不只是记住选择符(Selectors)那么简单,提升样式表的效用和可维护性,以及设计蓝图和管理工作流程都是工作的一部分.在本篇文章中,Jina Bolton给出了10个CSS技巧提示,这些内容是由对12位顶尖的设计者的调查提炼而来.

接下来,我将重点放在创建性感的样式表方法的讨论之上.一旦CSS被用来创建具有魅力的网站,CSS的书写事实上就已经成为了艺术.使用何种方法创建,架构以及管理CSS成为了一件美妙的事情.

那么怎么创建这些性感的样式表?样式表应该具有那些特征呢?

几个月前,我有幸出席了在俄勒冈州波兰特岛所召开的Web Visions 2007的主题会议.在准备我的演讲报告时,我调查了12位工作在网页设计方面的设计人员和开发人员.基于调查的结果,再结合我自己的工作经验,我编写了下面的一个列表用来在创建样式表的时候给予自己以适当的提醒.

01. 保持CSS脱离标记
使用链接或者导入样式表的方法对于中阶或高阶的CSS开发人员来说都是再正常不过的事情,但是我在这里依然会强调一下这种方法的重要性.我见过的许多站点,在创站之初,CSS文件很整洁,组织的也井井有条,但是随着时间的推移,这些文档由于内嵌的甚至内联(inline)的样式出现而变得杂乱无章,一方面可能是由于给予的更新期限很短,另一方面或许就是纯粹的由于懒惰.

你正忙于一个拥有成千上万条的渠道内容同时出现的网站的大面积更新,给你的期限很短,所以你就选择了使用内嵌或者内联样式这样一些”快速修补”的方法.一些年过去了,习惯依然…,直到有一天你被告知这个站点需要重新设计,但是所有的内容仍然不变,这个时候而你只有一个星期去完成.想象一下,这将是一个怎样的境况.

其实这是很普遍的情况,更新样式表是一个再简单不过的任务,在你几年的”快速修补”之后,这些样式遍布了整个站点,相信你根本没办法记住他们在那里.所以现在你面对的只有2个选择a)在一个星期之内找出一个方法去清理规整这些样式b)找一份新的工作吧.

千万不要将你的工作变得愈来愈困难.使用链接和导入样式表是你的不二之选.规范的创建并保持样式表的整洁,你会活得更容易一些.

提示:小心使用链接或导入的方法会在标记上添加冗余的样式.每次你创建新的样式表,你都会更新要不就是添加新的样式,过多的外联样式不只会使补丁的修复变得困难,也会使样式表更难于维护.因此可以理解为什么大型站点会为不同的区块部分而去分离样式表.小心不要玩过火了,过犹不及.

这里很值得提及一下的是过多的样式表将会使HTTP的请求数增加.这些都会潜在的影响性能.因此,Internet Explorer将链接的样式表数限制在了32个.

02. 语法不是猜字谜.
你应该明白为什么我会说到这个.语法学是你最好的朋友,选择合适的,有意义的元素去描述你的内容,确保你所选择的是富有语意的类(class)和ID特征值.做正确的事情会使你的生活变得容易很多,如果你是某个团队的一分子,对团队其他成员来说也是如此.看一下下面的这条规则:

.l13k { color: #369; }

如果你是刚接手这个工作,你在CSS文件中看到了上面的内容,你能不能说清楚这个类是什么意思?大部分情况下你都会说不.这个类的名称可能是个缩写,但是恐怕没有办法去弄清楚他到底是什么的缩写,眼前是一摸黑.或者是这种情况,可能是你把它放到这里,你现在很清楚它是什么意思,但是你能保证3年之后你还记得它是什么意思么?

现在我们看一下下面的规则:

.left-blue { color: #369; }

你可能立即知道这个类选择符是为左侧边栏的显示蓝色区块而创建的,这时它就正确的表达了一定的语意.正如我在上面提到的,一旦要你在在一周内要重新设计,但是在重构过程中,这个区块需要定位到右边,颜色变为红色,类的特征值就没有任何意义,所以你现在需要改变你所有的特征值,要不就什么都不改变,不过这样可能或导致重重的困惑.

因此解决上面问题的最好方法就是在类特征值的命名中避免使用颜色(包括颜色名称和十六进制值)或者宽度,高度的尺寸值.同时你也尽量的避免去使用任何表明表现形式的值,例如box.反之,将表现和内容分离的意义也就不复存在了.

最后,我们看一下最合适的命名规则:

.product-description { color: #369; }

你应该能理解,这个规则是应用于产品描述.无论你的设计改变了多少次都不会改变.清楚明了的感觉不错.

03. 体会注释的优点
如果使用注释的方法得当的话,为你的CSS文件添加注释可以在开发过程中给予你和其他人很大的帮助.最常见的是为CSS样式规则添加提示信息,不过使用注释对优化组织结构和提升效用也很有帮助.

提示和标签

这是注释最常用的途径,可以为自己或其他开发人员留下提示信息可以避免后期引起的不必要的困惑和麻烦.这种应用简洁性最为重要.例如:

/* Turn off borders for linked images */
img { border: 0; }

时间戳和签名

许多设计人员和开发人员会在最新更新的CSS文件标注日期时间,以及他们的名字.这些都会提供给我们一些联系信息以及文档更新信息.

/* Sushimonster Typography Styles Updated: Thu 10.18.07 @ 5:15 p.m. Author: Jina Bolton —————————————————-*/

对于一项工程,这种方法会很有用,如果你是小组一分子时,这更是显得尤其重要.要提醒的是,一些组织都要求在文档中留下这类信息,而有些公司喜欢把名字和日期这些信息放在文档之外的地方,所以在开始之前最好弄清楚这些事情.

组织

在CSS文档中使用注释指示不同的区块是个不错的主意.例如,如果所有的头部信息被组合在一起,你可以使用注释使它和下面的区块样式区分开来.

/* HEADER —————————————————-*/

接下来我会就此进行进一步的阐述,现在我们先讨论一下如何”分离样式类型”

注释标记

如果你的CSS文件都是按照我上面所说的按照区块进行划分的话,使用注释标记可以配合”查找”功能使你在文档的各个部分之间切换自如.标注一个章节(Chapter),例如使用等号”=”,然后在后面添加一个区块的名称,例如”HEADER”,这样就为你的CSS文档创建了一个”锚点”.

/* =HEADER —————————————————-*/

这种方法在内容繁杂的样式表中尤其有用.更多的相关信息你可以在

Stop Design 站点上了解
.

参考

将

在舞台新建一个影片剪辑，实例名为line，样子就随便画个长条

textwidth = 200; this.onEnterFrame = function() { this.line._width += textwidth/this._totalframes; }; onEnterFrame 在FLASH 帮助文件中的说明

onEnterFrame（MovieClip.onEnterFrame 处理函数） onEnterFrame = function() {} 以 SWF 文件的帧频重复调用。分配给 onEnterFrame 事件处理函数的函数将在附加到受影响的帧上的所有 ActionScript 代码之前处理。 必须定义一个在调用事件处理函数时执行的函数。您可以在时间轴上定义该函数，也可以在扩展 MovieClip 类或链接到库中的元件的类文件中定义该函数。 一旦满足阻止 Flash Player 调用已定义函数的条件，将 onEnterFrame 事件处理函数的值设置为 null。 可用性：ActionScript 1.0、Flash Player 6 示例下面的示例为 onEnterFrame 事件处理函数定义一个函数，该函数将 trace() 动作发送到"输出"面板： my_mc.onEnterFrame = function () { trace("onEnterFrame called"); }

个人理解onEnterFrame的作用就是逐帧执行函数中的代码，以上范例就是逐帧增加this.line._width的值达到动画效果

function copybtn() { //此函数用来生成按钮 nums = 10;//复制的个数 for (var j = 1; j<=nums; j++) { //复制库里的mc，并将其置于舞台上，分配好各自的坐标 _root.attachMovie("round", "abc"+j+"_mc", 100+j); _root["abc"+j+"_mc"]._x = 19.5+30*(j-1); _root["abc"+j+"_mc"]._y = 186.5; } }

_root.attachMovie("round", "abc"+j+"_mc", 100+j); 这句是重点，三个参数分别为 round 库里面的元件的标示符，在库中选择元件，右键点击选择链接，按如下图设置 "abc"+j+"_mc" 这个是置于舞台后的实例名 100+j 这个是置于舞台后的深度，数字大的上面

实现这个效果真是一波三折，花了一天多实现在研究清楚

实现代码如下：

 

 var myXML:XML = new XML();<br />myXML.ignoreWhite = true;<br />myXML.load("test.xml");<br />myXML.onLoad = function(suc) {<br /> if (suc) {<br />  loadStart();<br />  //载入完成后执行loadStart函数<br /> }<br />};<br />var myCL:MovieClipLoader = new MovieClipLoader();<br />function loadStart() {<br /> var swfurl = String(myXML.firstChild.childNodes[1].childNodes[1].firstChild);<br /> myCL.loadClip(swfurl, _root.container);<br />}

研究中出现的问题：

一、强制转换数据类型

a=String(b);

可以把b的类型转换成字符串赋予a

二、查看变量类型

trace(typeof(a));

可查看a的变量类型

 var ad = "ad/1.swf"; container._lockroot = true; var my_mcl = new MovieClipLoader(); my_mcl.loadClip(_root.ad, _root.container); 

说明：

ad为定义外部flash地址

container._lockroot = true;

flash的帮助文件中介绍如下：

一个布尔值，指定将 SWF 文件加载到影片剪辑中时 _root 引用的内容。默认情况下，_lockroot 属性为 undefined。您可以在正在被加载的 SWF 文件中或正在加载该影片剪辑的处理函数中设置此属性。

例如，假设您有一个名为 Games.fla 的文档，用于让用户选择要玩的游戏并将该游戏（例如 Chess.swf）加载到 game_mc 影片剪辑中。请确保，在加载到 Games.swf 中之后，在 Chess.swf 中对 _root 的任何使用都指向 Chess.swf 中的 _root（而非 Games.swf 中的 _root）。如果对 Chess.fla 具有访问权限并将其发布到 Flash Player 7 或更高版本，则可以将此语句添加到 Chess.fla 的主时间轴上

my_mcl.loadClip(_root.ad, _root.container);中前面是flash地址，后面是想要在哪里调用。

源码下载：flash外部调用.rar

本文转载自毅博客

我们在做网页的时候自己画的图也不错，自己做的布局也很精致，做的图标也很漂亮，第一眼看起来也觉得很漂亮，但是看看就觉得不舒服。也不清楚为什么，这里我告诉你，也许就是你的排版出现问题了。由于排版的不合理，所产生的视觉效果会对读者的眼睛产生一定的疲劳影响，基本的毛病在于“字间距太挤或太宽”、“行距太小或太大”、“段距太少或太多”、“每行字数太多或太少”等这几个常见因素。下面的内容可以从图示中看出效果来，同时我会给大家一个相对比较好的参数供大家参考。当然设计本来就不要太过拘泥，我所提供的都是一般性的提议，不同网站不同对待，不要过于拘泥我所给大家的一些参数。

 

大家看到上图，前三个是行距的问题：

第一个太挤了，都粘在一起了，这样眼睛在看这个文本的时候会需要花点时间去分辨，这样的排版会让读者看得很累。很不舒服。大家看一下自己手头上所做文本的是不是太挤了，如果是那就改一下吧！第二个是比较适中的，由于每行分得很清楚，这样看起来有很强的识别性。第三个是比较宽的，松了一点，这样看起来也很清楚，但是当你的文章不是一两行而是十几行与几十行的时候你就会觉得文章的连贯性产生了很严重的脱节，一般排版不会越过两个字体高度（2em）

下面两个就是字数的问题了，第四个每行文字太长，这样看起来头要摇来摇去，这样读者更容易显得很累。因为要不断的转动头，或是让眼球不断的左右摆动。最舒服的方式就是读者一眼看上去就能把一行看完，不然从行末到下一行行首也会形成断裂感。而下面的又太扁了，这样看起来也不是很舒服。由于在不断的换行阅读，眼球也会觉得不舒服。而推荐的最好的字数是： 不大于45个字母，不大于30个汉字。

上面的图是关于段距的，第一个是比较合适的，这样的把段落分开了，让读者觉得文章并不是很多很难读，而如果不把段落当一回事，任其自然那么就会如下面一样，两段成为一段，这里是两段还好，如果是几十段，那么这个文章就很少有人能读下去了！

在经典论坛中的行距已经重新设定过了，现在发布长篇的文章就不会觉得糊在一起了，并且在链接上加了下划钱，对于色盲或色弱的朋友也容易识别，更为人性化了！

mysql -h localhost -u username -p //登录mysql数据库
create database dbname;//创建数据库
insert into 表名 (字段1,字段2,字段3,…) values (数据1,数据2,数据3,…);
select * from 表名 where 条件;
SELECT * FROM `customers` WHERE name like ("%mi%");
select orders.orderid, orders.amount, orders.date from customers, orders where customers.name = ‘Julie Smith’ and customers.customerid = orders.customerid;
delete from 表名 where 条件；
update 表名 set 表达式（如 字段=“值”） where 条件；

php数据库链接
@ $db = new mysqli(‘localhost’, ‘用户名’, ‘密码’, ‘数据库’);

php执行SQL语句
$query = "sql语句";
$result = $db->query($query);