一、简介

  HTC脚本全称是Html Companent即html组件,个人认为它是为了在开发动态HTML中实现代码重用和页面共享目的,主要是把“行为”作为组件封装,可以在很大程度上简化DHTML的开发,所用的语法知识也都是基于js和css。

二、入门示例

1)htc文件(font_effect.htc)

<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="glowit()"/>
<PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="noglow()"/>
<PUBLIC:ATTACH EVENT="onmousedown" ONEVENT="font2yellow()"/>
<PUBLIC:ATTACH EVENT="onmouseup" ONEVENT="font2blue()"/>
<PUBLIC:METHOD NAME="move_down"/>
<PUBLIC:METHOD NAME="move_right"/>
<SCRIPT LANGUAGE="JScript">
var font_color;
function move_down(){
element.style.posTop += 6;
}
function move_right(){
element.style.posLeft += 6;
}
function font2blue(){
if(event.srcElement == element){
element.style.color='blue';
}
}
function font2yellow(){
if(event.srcElement == element){
}
}
function glowit(){
if(event.srcElement == element){
font_color=style.color;
element.style.color='white';
element.style.filter="glow(color=red,strength=2)";
}
}
function noglow(){
if(event.srcElement == element){
element.style.filter="";
element.style.color=fontcolor;
}
}
</SCRIPT>

2)对应的页面调用

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>htc学习示例</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<style>
.myfilter{behavior:url(htc/font_effect.htc);position:relative;font-weight:bold;width=180;left:0;}
</style>
</head> <body>
<button onclick="myspan.move_right();" >向右移动第一行文字</button><br/>
<button onclick="myspan.move_down();" >向下移动第一行文字</button>
<div><span id="myspan" class='myfilter'>行为产生的文字效果</span><br/></div> </body>
</html>

HTC脚本介绍和入门示例的更多相关文章

  1. 【Unity 3D 游戏开发】Unity3D 入门 - 工作区域介绍 与 入门示例

    一. 工作区域详解 1. Scence视图 (场景设计面板) scence视图简介 : 展示创建的游戏对象, 可以对所有的游戏对象进行 移动, 操作 和 放置; -- 示例 : 创建一个球体, 控制摄 ...

  2. Unity3D 入门 - 工作区域介绍 与 入门示例

    一. 工作区域详解 1. Scence视图 (场景设计面板) scence视图简介 : 展示创建的游戏对象, 可以对所有的游戏对象进行 移动, 操作 和 放置; -- 示例 : 创建一个球体, 控制摄 ...

  3. JVM插庄之一:JVM字节码增强技术介绍及入门示例

    字节码增强技术:AOP技术其实就是字节码增强技术,JVM提供的动态代理追根究底也是字节码增强技术. 目的:在Java字节码生成之后,对其进行修改,增强其功能,这种方式相当于对应用程序的二进制文件进行修 ...

  4. shell的case脚本的简单入门

    shell的case脚本的简单入门 示例1: #/bin/bash a=$ case "$a" in ") echo 'hell 2';; ") echo 'h ...

  5. Shell脚本编程学习入门 02

    Shell脚本编程学习入门是本文要介绍的内容,我们可以使用任意一种文字编辑器,比如gedit.kedit.emacs.vi等来编写shell脚本,它必须以如下行开始(必须放在文件的第一行):   #! ...

  6. [WCF编程]1.WCF入门示例

    一.WCF是什么? Windows Communication Foundation(WCF)是由微软开发的一系列支持数据通信的应用程序框架,整合了原有的windows通讯的 .net Remotin ...

  7. Maven入门示例(3):自动部署至外部Tomcat

    Maven入门示例(3):自动部署至外部Tomcat 博客分类:  maven 2012原创   Maven入门示例(3):自动部署至外部Tomcat 上一篇,介绍了如何创建Maven项目以及如何在内 ...

  8. 1.【转】spring MVC入门示例(hello world demo)

    1. Spring MVC介绍 Spring Web MVC是一种基于Java的实现了Web MVC设计模式的请求驱动类型的轻量级Web框架,即使用了MVC架构模式的思想,将web层进行职责解耦,基于 ...

  9. OUYA游戏开发核心技术剖析OUYA游戏入门示例——StarterKit

    第1章  OUYA游戏入门示例——StarterKit StarterKit是一个多场景的游戏示例,也是OUYA官方推荐给入门开发者分析的第一个完整游戏示例.本章会对StarterKit做详细介绍,包 ...

随机推荐

  1. xgboost原理及应用--转

    1.背景 关于xgboost的原理网络上的资源很少,大多数还停留在应用层面,本文通过学习陈天奇博士的PPT地址和xgboost导读和实战 地址,希望对xgboost原理进行深入理解. 2.xgboos ...

  2. Django中CBV及其源码解释

    FBV(function base views) 就是在视图里使用函数处理请求. CBV(class base views) 就是在视图里使用类处理请求. Python是一个面向对象的编程语言,如果只 ...

  3. implode

    $names = implode('|', array_column($categoryBackNameArr, 'name'));

  4. bzoj3876: [Ahoi2014&Jsoi2014]支线剧情

    题意:给一幅图,从1开始,每条边有边权最少走一遍,可以在任意点退出,问最小花费 题解:上下界费用流,每个边都流一遍,然后为了保证流量平衡,新建源点汇点,跑费用流把流量平衡 /************* ...

  5. 发送http请求,get和post两种请求方式

    GET请求 GetMethod getMethod=null; String datas = "json=" + plain; HttpClient httpClient = ne ...

  6. 函数使用九:CAT_CHECK_RFC_DESTINATION

    此函数是用来检查RFC DESTINATION是否存在,RFC是否通 Import RFCDESTINATION          RFC目标  类型:RSCAT-RFCDEST Export MSG ...

  7. 62. Unique Paths不同路径

    网址:https://leetcode.com/problems/unique-paths/ 第一思路是动态规划 通过观察,每一个格子的路线数等于相邻的左方格子的路线数加上上方格子的路线数 于是我们就 ...

  8. IDEA 自动生成 serialVersionUID 的设置

    打开File菜单,选择Settings选项,打开Settings设置对话框:左边树形目录,打开Editor>Inspections

  9. 使用maven构建一个web项目

                          使用maven构建一个web项目     首先建立一个maven项目(关于环境配置上节有详细过程): 1)-->右键new,-->project ...

  10. Vue为v-html中标签添加CSS样式

    在最近的vue项目中遇到的问题:v-html渲染的富文本,无法在样式表中修改样式: <template> <div class="msgHtmlBox" v-ht ...