`
endual
  • 浏览: 3578115 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

html button的不同状态

 
阅读更多 

<!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>无标题文档</title>
        <style type="text/css">

        </style></head>

    <body>

        <script>
            window.onload=function(){
                var button=document.getElementsByName("imageField1")[0];
                if(button.disabled=="true") button.src="DEST_LAYOUT_D.PNG"
            }
            function pngclick(e){
                var obj=e.srcElement||e.target;
                obj.src="DEST_LAYOUT_C.PNG"
                location.href="http://www.baidu.com"
            }
            function imgfocus(e){
                var obj=e.srcElement||e.target;
                obj.src="DEST_LAYOUT_B.PNG"
            }
            function imgout(e){
                var obj=e.srcElement||e.target;
                obj.src="DEST_LAYOUT_A.PNG"
            }
        </script>

        <input name="imageField1" type="image" src="DEST_LAYOUT_A.PNG"  onmousedown='pngclick(event)'

               onmouseover='imgfocus(event)' onmouseout="imgout(event)">

    </body>
</html>
 
分享到：
| 西部数码 425 Security: Bad IP connecting ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    html实现的几款button效果

    HTML（超文本标记语言）是构建网页的基本语言，而`&lt;button&gt;`元素是HTML中用于创建按钮的关键元素。本文将深入探讨如何利用HTML实现不同效果的按钮，为您的网页增添互动性和美观性。 1. 基本按钮： 在HTML中，一个...

    html5--button

    4. **事件处理**：`&lt;button&gt;`元素支持各种JavaScript事件，如`onclick`、`onmouseover`等，这允许我们添加自定义的行为，比如弹出提示框、调用函数或改变按钮状态。 5. **样式控制**：CSS可以用来改变按钮的外观，...

    button按钮样式美化

    为了适应不同设备的屏幕尺寸，可以使用媒体查询（Media Queries）来实现按钮样式的响应式设计： ```css @media (max-width: 600px) { button { font-size: 14px; padding: 6px 12px; } } ``` 六、预处理语言 ...

    html css button样式

    7. **过渡效果**：`transition`属性可以平滑地过渡按钮在不同状态间的样式变化，增加视觉吸引力。例如： ```css button { transition: background-color 0.3s ease, border-color 0.3s ease; } ``` 8. **焦点状态...

    html5-css3-pretty-button_html_Pretty_

    在“html5-css3-pretty-button”项目中，你可能还会发现不同类型的按钮样式，比如带有图标、下拉菜单或者自定义边框的按钮。这些可能通过结合使用HTML5的`&lt;i&gt;`元素、`&lt;svg&gt;`元素，或者CSS3的伪元素如`:before`和`:...

    button 按钮例子button

    在本示例中，"button 按钮例子button"标题可能指的是一个包含多个不同类型的按钮展示的项目，如进度条按钮、旋转按钮和动态按钮。这些特殊类型的按钮都是为了提供更丰富的用户体验和交互效果。下面我们将详细讨论...

    CssButton按钮样式

    提供的文件`CssButton3.html`、`CssButton4.html`、`CssButton2.html`、`CssButton.html`、`CssButton5.html`可能包含了不同样式的按钮实例。这些文件可以作为学习和参考的资源，通过查看和分析这些示例，你可以更好...

    漂亮的button样式

    一个基本的HTML按钮元素 `&lt;button&gt;` 或 `&lt;input type="button"&gt;` 可以通过CSS来定制外观。例如，我们可以设置按钮的尺寸、颜色、字体、边框和背景等属性，如： ```css button { width: 150px; height: 40px; ...

    Uniapp 各类 button按钮

    Button 组件在不同端的行为可能会有所不同，例如在 H5 上可能需要处理浏览器的兼容问题，而在小程序中则需要关注开放能力的使用。因此，在实际开发中，你需要根据目标平台调整按钮的属性和事件。 7. **应用场景** ...

    button点击效果

    在这段代码中，`button_normal`和`button_pressed`分别是默认状态和按下状态的图形资源，它们也可以是其他XML形状资源或者PNG图片。 接下来，我们将在布局文件中应用这个点击效果。布局文件（通常位于`res/layout`...

    button的漂亮样式

    以上只是一些基本的样式设计技巧，实际应用中可能还需要考虑更多因素，如按钮的状态（如禁用、激活等）、按钮组的排列、不同主题下的样式等。在"codefans.net"这个文件中，可能包含了一些实际的代码示例，供开发者...

    透明button

    这篇博文《透明button》可能探讨了如何在编程中实现这种效果，以及它在不同场景下的应用。 透明按钮的设计通常涉及到以下几个关键知识点： 1. **颜色透明度**：在图形用户界面中，透明度是通过Alpha通道来控制的，...

    element-ui 的el-button组件中添加自定义颜色和图标的实现方法.docx

    但是在实际开发中，我们可能需要添加不同的颜色和图标来表示不同的状态或类别。这时，我们可以使用自定义的方法来实现。 添加自定义颜色和图标的实现方法可以分为两步：第一步，我们需要在 Element UI 的源码中添加...

    自定义checkbox与button操作

    "自定义checkbox与button操作"这个主题涉及到如何通过编程实现一种特定的用户交互模式，即根据checkbox的状态来控制button的功能和视觉表现。这通常是通过JavaScript、CSS以及HTML来实现的。 首先，我们需要了解...

    css3-button.

    标题 "css3-button" 暗示我们关注的是CSS3在创建按钮（button）方面的应用。CSS3是层叠样式表的第三版，它引入了许多新的功能和改进，使得网页设计更加丰富多彩，尤其是在按钮设计上提供了更多的可能性。下面将详细...

    超漂亮的CSS 按钮 button

    4. **状态样式**：按钮通常有不同状态，如默认、悬停、激活和禁用。使用`:hover`、`:active`、`:focus`和`:disabled`伪类可以为这些状态定义不同的样式。 5. **过渡与动画**：`transition`属性允许我们在按钮状态...

    css+button

    在这里，我们分别为这两个状态定义了不同的背景图片，比如`button-hover.png`和`button-clicked.png`，这样在鼠标移动到按钮上和点击按钮时，图片就会自动切换。 如果需要更复杂的交互效果，如动画过渡，可以使用...

    button小案例

    在HTML中，`&lt;button&gt;`标签有三种类型：`submit`、`reset`和`button`。默认情况下，`type="submit"`，意味着按钮会提交表单；`type="reset"`则会重置表单中的所有输入字段；而`type="button"`则是一个普通按钮，不会...

    一些漂亮的css3button

    例如，可以使用伪类（:hover, :active, :focus）来实现按钮在鼠标悬停、点击和获取焦点时的不同状态，利用动画效果（transition和animation）增加动态感，还可以通过媒体查询（media query）实现响应式设计，使按钮...

    很好看的一些button

    1. **基础样式**：首先，一个基本的HTML按钮通常由`&lt;button&gt;`或`&lt;input type="button"&gt;`标签创建。通过设置`width`、`height`、`padding`、`border`和`background-color`等属性，可以调整按钮的尺寸、边框和背景。 ...

Magicbox
Global site tag (gtag.js) - Google Analytics