快捷搜索:

Web页面 自定义选择框Select

Web页面自定义选择框Select

  select下拉列表表单可能大家都很熟悉,不过默认的下拉列表表单往往会让一些网站觉得丑陋,同时用CSS也很难调整select的样式asp代码加密。因此许多网站位了做出更符合网站风格的select下拉表单,往往会用JS来模拟这种效果。

  这样做的结果很明显在视觉上与网站整体风格统一,并且下拉列表样式很漂亮,不过也带来了一些不良反应,因为用JS来做的,所以会碰到许多预想不到的效果,下面通过测试者三个网站我们一一来分析他们各自的缺陷:

  1. 点击后,弹出列表的位置与预期不同。潜意识里是下拉列表,结果土豆给了我一个“中拉列表”。

  Select 选择框是一个非常成熟的交互控件。成熟意味着用户很容易接受,但成熟也意味着对各种用户都考虑很周全,有着非常丰富的交互细节。比如:对 PgUp/PgDn, Home/End 等键盘操作的响应,以及在不同位置能自动调节下拉列表的弹出方向等等。

  采用 JS 来模拟选择框,需要大量的工作和细致的测试。即使公司愿意投入,也依旧无法实现原生控件的某些特性。比如:上面 Amazon 的选择框,我把浏览器拉到很矮,这时下拉列表能伸出到浏览器外面去。

  为了一丁点“视觉小甜点”,让交互丧失了如此多的实用细节,还得耗费前端程序员的大量时间,结果却费力不讨好asp学习,实在是很糟糕。

  HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE、CONNECT 这几种。其中 POST 一般用来向服务端提交数据,本文主要讨论 POST 提交数据的几种方式。我们知道,HTTP 协议是以 ASCII...查看详情

  HTML的发展历史:HTML英语意思是Hypertext Marked Language,即超文本标记语言,是一种用来制作超文本文档的简单标记语言。HTML是由WEB的发明者Tim Berners-Lee和同事nolly于1990年...查看详情

  一、<div></div>和<span></span>1.<div></div>标签<div></div>标签可定义文档中的分区或节(division/section),从而把文档分割...查看详情

  简介最近在做大作业的时候需要做一个弹幕播放器。借鉴了一下别人的源码自己重新实现了一个,演示如下主要的功能有发送弹幕设置弹幕的颜色,速度和类型显示弹幕已知缺陷:不能全屏canvas没有做自适应没有自定义播放器控件没有根据播放时间显示相应的弹幕弹幕不能实现悬停...查看详情

  name指定标签的名称。格式<input type="text" name="username" />应用场景①form表单:name可作为转递给服务器表单列表的变量名;如上面的传到服务器的名称为:username=text的...查看详情

  <input>标签<input> 标签用于搜集用户信息。type属性根据不同的 type 属性值,输入字段拥有很多种形式。可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。text:文本区域readonly属性:是否只读。passwor...查看详情

  简介meta标签是HTML语言HEAD区的一个辅助性标签。meta常用于定义页面的说明,关键字,最后修改日期,和其它的元数据。这些元数据将服务于浏览器(如何布局或重载页面),搜索引擎和其它网络服务。mata 标签包含全局属性(查看详情

  前言meta是html语言head区的一个辅助性标签。也许你认为这些代码可有可无。其实如果你能够用好meta标签,会给你带来意想不到的效果,meta标签的作用有:搜索引擎优化(SEO),定义页面使用语言,自动刷新并指向新的页面,实现网页转换时的动态效果,控制页面缓冲,网页定级评价...查看详情

  XML/HTML Code复制内容到剪贴板 <inputid="username"name="username"type="text"placeholder=&...查看详情

您可能还会对下面的文章感兴趣: