打印本文 打印本文 关闭窗口 关闭窗口
习作:组件HTML UI Components
作者:武汉SEO闵涛  文章来源:敏韬网  点击数1435  更新时间:2003/7/5  文章录入:mintao  责任编辑:mintao
第一个FLASH插件作品 :D
 这里下载

效果演示
huc_preview.swf
huc_preview_2.swf

主要有四个组件组成,分别是:HR横隔线、Image图片、Hyperlink超链接和Tabular data数据表格

HR横隔线:
简介:
类似HTML中的<HR>,有实时预览
参数说明:
width - 宽度
height - 高度
shading - 是否显示阴影线
allow color - 是否允许使用颜色填充
color - 颜色

Image图片:
简介:
类似HTML中的<Img>,有实时预览
参数说明:
src - 图片地址(注意,因为FLASH本身的关系,只支持JPG格式图片)
size fixed - 是否强制以指定尺寸显示
width - 图片宽度
height - 图片高度
url - 为图片添加超链接地址(为空则不提供链接)
target - 链接将在指定窗口打开

Hyperlink超链接:
简介:
类似HTML中的<a>,有实时预览
参数说明:
text - 超链接的文字
url - 链接地址
target - 链接将在指定窗口打开
font - 链接使用的字体
size - 链接使用的字号
link color - 链接使用的颜色
link bold - 是否加粗
link underline - 是否加下划线
link italic - 是否使用斜体字
transparent - 是否透明背景
bg color - 如果不透明将使用该颜色作背景色
hover color - 鼠标略过链接使用的颜色
以下略,设置同link,只是设置的是鼠标略过时的样式...

Tabular data数据表格:
简介:
读取外部xml格式的文件,并将数据按所设置的表格样式在FLASH中输出,无实时预览
参数说明:
data url - 数据源文件地址
font - 文字使用的字体
font size - 文字字号
XML文件格式范例:
== table.xml ==

<?xml version="1.0"?>
<table border="0" cellspacing="1" bgcolor="#000000">
    <tr>
        <td href="#" width="50" color="#FF0000" bgcolor="#CCCCCC">test</td>
        <td href="#" width="60" color="#FF0000" bgcolor="#CCCCCC">test</td>
        <td href="#" width="100" color="#FF0000" bgcolor="#CCCCCC">test</td>
        <td href="#" width="100" color="#FF0000" bgcolor="#CCCCCC">test</td>
    </tr>

    <tr>
        <td href="#" bgcolor="#CCCCCC">short1</td>
        <td href="#" bgcolor="#CCCCCC">looooooooong</td>
        <td href="#" bgcolor="#CCCCCC">normal</td>
        <td href="#" bgcolor="#CCCCCC">normal</td>
    </tr>

    <tr>
        <td href="#" bgcolor="#CCCCCC">short2</td>
        <td href="#" bgcolor="#CCCCCC">looooooooong</td>
        <td href="#" bgcolor="#CCCCCC">normal</td>
        <td href="#" bgcolor="#CCCCCC">normal</td>
    </tr>

    <tr>
        <td href="#" bgcolor="#CCCCCC">short3</td>
        <td href="#" bgcolor="#CCCCCC">looooooooong</td>
        <td href="#" bgcolor="#CCCCCC">normal</td>
        <td href="#" bgcolor="#CCCCCC">normal</td>
    </tr>

    <tr>
        <td href="#" bgcolor="#CCCCCC">short4</td>
        <td href="#" bgcolor="#CCCCCC">looooooooong</td>
        <td href="#" bgcolor="#CCCCCC">normal</td>
        <td href="#" bgcolor="#CCCCCC">normal</td>
    </tr>
</table>

== table2.xml ==
<?xml version="1.0"?>
<table border="5" cellspacing="3" cellpadding="3" bordercolordark="#808080" bordercolorlight="#DAD0C8" bordercollapse="false">
    <tr>
        <td href="#" width="50" color="#FF0000" bgcolor="#FFFFFF">aaaa</td>
        <td href="#" width="80" color="#FF0000" bgcolor="#FFFFFF">bbbbbbbbbb</td>
        <td href="#" width="80" color="#FF0000" bgcolor="#FFFFFF">cccccccccc</td>
        <td href="#" width="100" color="#FF0000" bgcolor="#FFFFFF">dddddddddddd</td>
    </tr>
</table>

增加表格排序功能~
huc_preview_2.swf

因为还有一些要增加的功能,等全部完成后再重新封装成插件
全部独立制作,未参考

增加高亮显示功能
huc_preview_3.swf

打印本文 打印本文 关闭窗口 关闭窗口