首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

前端设计入门

前端知识 UI框架 需要指出,Bootstrap虽然使用广泛,只能作为UI框架。绝大多数的网站有自己的设计风格,因此也应该有自己的设计语言。...如何学习 作为设计师,很多时候我们可以先不必深究它们的原理,而是尝试直接应用它!这样成就感会来得很快,并且你可以通过实际应用更加理解 JavaScript 是用来做什么的。...入门篇(JavaScript/jQuery) 推荐你使用 w3school 在线教程 与 http://www.codecademy.com/ 进行学习,如果学习得顺利,你还可以尝试使用各种丰富的...jQuery 插件,你会发现写出支持用户交互的网站也没有那么困难~很多看上去很复杂的功能(比如轮播图、灯箱、下拉菜单),搜一搜然后看看文档(教程)、改改示例代码就好了。...不同人有不同解决方案,有功夫可以自己去尝试尝试

69530
您找到你想要的搜索结果了吗?
是的
没有找到

JS简史

编程语言就是用来让用户解决这些问题的工具,而用在web或其他地方的JS自然也没有什么不同。有些人乐于细数JS的种种不是,我也不否认确实有很多问题,但对于其他语言来说也是这样的。...要是真的说尽这门语言详尽的历史,那足够写完一本书了;而本文只尝试对“我们在哪?”和“我们为什么在这?”这类问题给出大体和不失水准的回答,这也是标题叫做“简史”的原因。...并用它创建不那么好用的下拉菜单和有一些简单动画的烦人弹出框”。 讨厌的滚动文字、弹出提示、确认框和很多安全验证充斥着那时的网页。...当 jQuery 已经提供了 show/hide/toggle 这些函数时,为什么要自己再写一遍呢?“jQuery并未真正改变用JS创建的东西”,Nelson 说,“但是确实改变了如何创建的方式。...其网站上的这段文字是这样阐释的: “采用 jQuery 的选择器和回调创建 JS 应用确实简单,终将陷入一团乱麻;你将手忙脚乱的保持数据在 HTML UI 和 JS 逻辑,以及服务器数据库之间的同步。

1.4K40

React从入门到放弃,一个关于网页速度的故事

我在我的新工作中尝试了 React,并在 Clojure 主题的峰会(Clojure Cup 2013)期间发现 CLJS 和 React 简直是天作之合。React 为什么这么好呢?...当你使用之前的东西,例如 jQuery、Backbone、Angular 或者其它东西,只需一年的开发之后,你的代码就会是一团事件监听器和触发器。...千万别让我碰那些莫名其妙的 JS,jQuery 根本就不存在代码封装。哪个处理器在哪里绑定,用来做什么?很难说这是一个好的基础库!...当然,它与 Intercooler 有些不同之处,不然它为什么会存在?最值得一提的就是,它不依赖 jQuery。...6 结论 从首次尝试到发布,我们花了 4 个月时间。并不是我们刚开始时预想所需的时间(“应该最多需要两三周!”),呵呵,并不是只有我们这么做。

1K20

干货丨常用JS前端开发框架有哪些?

底层的前端框架领域中,早先是jquery称霸互联网,近些年,MVVM类型的框架成为主流,Vue、React和Angular三大框架并驾齐驱。目前这四种是开发者使用较广的底层框架。...1.Foundation框架 Foundation框架总体来看要比Bootstrap略显高大上一点,但他们俩的设计理念都是非常清楚的,Bootstrap有引导的意思,尝试处理你项目中的一切所需。...提供优雅的HTML和CSS规范,在jQuery的基础上进行更加个性化和人性化的完善。...兼容大部分jQuery插件,并包含了丰富的Web组件,如下拉菜单、按钮式下拉菜单、导航条、按钮组、分页、缩略图、进度条和媒体对象等。...在远程服务器上工作时,Tmux特别有用,因为它允许用户创建新的选项卡,而无需再次登录。 6 du du命令用于生成关于文件和目录的空间使用情况的报告。

4.6K20

零基础入门 20: UGUI DropDown

(题外话,因为这期分享中段制作之后,微信平台抽疯,Gif图无法使用,导致我不得不尝试用其他的方式来让文章看起来没那么死板,在后面的部分展示中,我插入了视频文件而并非Gif,不过大小进行了控制,不会浪费太多流量...什么是Dropdown呢?就是我们所谓的下拉菜单,点开以后有一定数量的下拉选项,以供使用者进行对应的筛选操作等。 我从网上找到了一张下拉菜单的图。大家可以参考下,一看便知Dropdown是什么 ?...知道了如何在编辑器下创建并且设置下拉菜单以后,以及在了解了Dropdown这个组件的一些属性内容之后,又到了我们在脚本内创建并且控制组件的时候了,毕竟实际使用中,有时候很多需求都要求我们动态的去设置下拉菜单的内容...(从这开始,微信平台抽疯,导致Gif无法使用,以致于我不得不去尝试用视频的方式来给大家完成后面的分享,不过每个视频的大小进行了控制,不会很大) (在制作视频的时候,我会尽量把关键点拉近给大家看,这样就算视频效果不是很清晰的时候...在学会了如何动态的设置下拉菜单的内容以后,最后一步就是学习一下,如何在菜单点击切换发生改变的时候,拿到这个事件,从而做一些事件处理。下面的这个视频也是这篇分享里的最后一个。

2.7K50

最近做的几件事

2、二级下拉菜单联动:从网上搜索出的一种解决方案,但是该方案仅仅是界面上的实现,功能上并未实现,加之JS的DOM操作一开始还不熟练,这里又卡我两天。 其他细节,看着CI的说明文档,基本能解决。...现在明白为什么Facebook把Timeline每个内容的宽度设置为411px,1000px的总宽度,3栏来分,还真不够分,尤其是文章内容如果有图片或者代码啥的,窄了就不好看了。...刚开始动手写Timeline的时候,走了很多弯路,后来发现居然有jQuery Masonry plugin这么一个插件,好吧,我投降。...路由控制是个很爽的东西,最近才体会到,REST更爽。前后端的联系,就通过URI即可,不过还不会写REST的控制器,找空用LazyPHP+Ajax做点东西试试。...新购入一个域名,专门备案,然后放国内,然后尝试各种CDN,可惜,备案依旧是各种麻烦,点点、SAE等都开始使用一种比较绕的方式进行域名绑定,其实和我之前提到的伪绑定差不多,都是重定向,绕一个弯,SAE自带的

32000

Bootstrap笔记

Bootstrap简介什么是Bootstrap?...;其目的是为了让 Web 开发更敏捷;是 Twitter 公司的两名前端工程师 Mark Otto 和 Jacob Thornton 在 2011 - 年发起的,并利用业余时间完成第一个版本的开发;为什么使用...Glyphicons标签徽章缩略图大屏幕嵌入内容内嵌JavaScript插件JavaScript插件的依赖情况如何使用Javascript插件内置组件模态对话框下拉菜单滚动监听标签页工具提示弹出框警告框按钮折叠面板轮播图吸顶效果...其目的是为了让 Web 开发更敏捷; 是 Twitter 公司的两名前端工程师 Mark Otto 和 Jacob Thornton 在 2011 - 年发起的,并利用业余时间完成第一个版本的开发; 为什么使用...插件的依赖情况 如何使用Javascript插件 内置组件 模态对话框 下拉菜单 滚动监听 标签页 工具提示 弹出框 警告框 按钮 折叠面板 轮播图 吸顶效果 data-spy=”affix” data-offset-top

3.3K90

Bootstrap运用终极指南

什么推荐使用Bootstrap开始编程呢? 使用Boostrap比在Web项目上从零开发更有优势。其中最大的一个优势是:与许多其他框架和模板相比,Bootstrap有大量现有资源可用。...预样式组件: Bootstrap程序还提供用于下拉菜单、导航条、弹窗和许多其它功能的预样式组件。 6....虽然Bootstrap是响应式、移动端优先的前端框架,如果你想开发一个非响应式的站点,可以选择禁用响应式布局。...15. jQBootstrapValidation 是一个用于Bootstrap表单的jQuery验证插件,它易于使用,并且当验证发生错误时,可以提供清晰的错误说明。 16....如果你仍不确定使用什么框架进行开发,不妨花点时间研究一下与其它框架相比Bootstrap可以做什么 (或者说你觉得用它做什么比较顺手),然后选择最适合项目需求的框架。

4.1K11

javascript 学习小结 JS装逼技巧(一) by FungLeo

解决jquery ajax调用远程接口的跨域问题 首先,接口必须允许远程调用.这是后端或者运维的事情.你必须保证你得到的一个接口是允许远程调用的.否则,就没啥了....不要问我为什么,我只会用~ 利用jquery 创建 json 数据 首先,我想到的居然是字符串拼接的方法.被别人看到后笑话了半天,说你是真够笨的....尽量少的去操作DOM结构 举个例子,我们可能经常会做的就是三级联动的省市县代码.而下拉菜单很显然需要我们去操作DOM结构....小结 命名一定要规范,不要尝试使用别人看不懂的命名.有时候,好的命名胜过一切. 如果逻辑很复杂,尝试把复杂的逻辑拆解成一个一个的小逻辑,这样能够更加好的解决问题和排查问题....本文由FungLeo原创,允许转载.转载必须署名作者,并保留文章首发链接.否则将追究法律责任.

49520

前端-10款web动画插件

今天分享的这款就是基于jQuery的瀑布流图片筛选插件,我们可以点击图片分类名称,即可将对应分类下的图片以瀑布流的方式展示出来,这款插件在筛选图片上使用还是比较方便的。 ?...5.jQuery左侧边栏多级菜单 适合后台管理页面使用 这是一款基于jQuery的侧边栏多级下拉菜单插件,这个菜单的特点是可以固定在左侧边栏,当页面滚动时整个菜单可以保持一直可见,方便操作。...这种菜单非常适合在网站的后台管理页面中使用。 ?...因为用上了一些CSS3的动画属性,所以这个超链接图片弹出动画有很多种,你也可以自己尝试定义一些新的动画效果。 ?...10.CSS3深色背景的垂直手风琴菜单 手风琴菜单我们已经分享过很多了,特别是垂直手风琴菜单更为常见,比如这款jQuery手风琴样式的多级下拉菜单和这款CSS3带小图标的手风琴下拉菜单都非常不错。

5.9K50

Jump Start Bootstrap 第4章

现在,我们有了一个简单的下拉菜单,在单击链接时显示菜单。我们可以在浏览器中查看它,如图所示。 ? 让我们结合使用下拉式插件和我们在前一章中创建的标签和按钮菜单。...在这里,请求是打开和关闭下拉菜单。 让我展示一个如何使用这些事件的例子。我已经写了下面的JQuery代码片段去监听所有的下拉插件状态,并打印每个事件触发时的状态。 <!...Tabs选项卡 在前面的章节中,我们了解了如何使一组链接看起来像选项卡,那不是真的选项卡。在本节中,我们将创建一些选项卡窗格,将一些虚拟数据放入其中,并使这些选项卡窗格响应相应的选项卡链接。...它是一个插入多个垂直堆叠标签的插件,同一时间只能打开一个标签。 在Bootstrap中,通过将多个面板组件组合在一个容器中来创建Collapse。我们在最近一章看到了如何创建一个面板。...然而,构建这样的幻灯片可能很耗时,而且这些特性也很容易发生bug。在本节中,我们将看到如何使用Bootstrap的carousel插件来构建漂亮的响应式幻灯片。

28.3K40

使用Jenkins自动部署博客

由于使用了Nginx,所以只要博客的HTML发生了更新,那么使用浏览器访问https://kingname.info时,新内容自动就会出现。...问题是,服务器怎么知道GitHub发生了更新? 有人说,Kingname,你不是做爬虫吗?你写个爬虫,每一秒检查一下GitHub不就可以了吗?这种办法当然可以。...需要注意的是,这仅仅是一个普通的文件夹而已,别看它的名字长得像个网址,其实它只是一个名字比较怪的普通文件夹而已,没有什么特殊的意义。...修改权限 由于Jenkins在安装的时候,会自动创建一个名为的普通账号,这个账号没有管理员权限。jenkins执行命令的时候,它也会使用这个账号。...使用方法 没有什么复杂的使用方法,在Hexo中,执行命令就可以把本地生成好的HTML文件提交到GitHub中。然后打开浏览器,打开博客,发现新的文章已经出现在首页了。

1.1K50

html中下拉菜单(html做下拉菜单栏)

html5如何实现文本框下拉选项功能 使用html5或者jQuery如何实现文本框下拉效果,如下图 CSS布局HTML小编今天和大家分享大神详解最好有可以使用HTML5 list 属性。...dx html5怎样写下拉菜单 1)、普通下拉列表菜单html代码如下: 普通下拉列表菜单 DIVCSS5 DIVCSS5 2)、跳转下拉列表菜单(如常见点击后跳转到选择网站)常常一些网站做友情链接,与部门之间使用...html5中如何创建两个下拉列表并且内容不同?CSS布局HTML小编今天和大家分享代码。 html5中如何创建两个下拉列表并且内容不同?CSS布局HTML小编今天和大家分享代码。...在没有设置position属性时,页面显示如下(见图1),T1并未遮挡住T2,HTML5让导航栏固定顶部不动且不遮挡住下面的DIV方法如下: 1,首先在html中,添加良好的导航内容。...…如图,此为正常效果,但是在部分手机浏览器中,下拉列表中的按钮没有显亲,欢迎来到CSS布局HTML,很乐意为你解答问题,目前并不是所有手机浏览器都支持HTML5+CSS3的功能 所以并不是你使用了CSS3

11.3K40

JS前端开发框架常用的有哪些?

在底层的前端框架领域中,早先是jquery称霸互联网,近两年MVVM类型的框架成为主流,Vue、React和Angular三大框架并驾齐驱。目前这四种是开发者用的最多使用交广的底层框架。...界比较常用的web前端框架分享给大家: 1、Foundation框架 Foundation框架总体来看要比Bootstrap略显高大上一点,但他们俩的设计理念都是非常清楚的,Bootstrap有引导的意思尝试处理你项目中的一切所需...提供优雅的HTML和CSS规范,在jQuery的基础上进行更加个性化和人性化的完善。...兼容大部分jQuery插件,并包含了丰富的Web组件,如下拉菜单、按钮式下拉菜单、导航条、按钮组、分页、缩略图、进度条和媒体对象等。...在远程服务器上工作时,Tmux特别有用,因为它允许用户创建新的选项卡,而无需再次登录。 6、du du命令用于生成关于文件和目录的空间使用情况的报告。

3.6K20

你不可不知的腾讯混元大模型前端开发实战技巧

这种方式虽然大部分情况下能解决问题,搜索和筛选还是需要花费不少精力的,搜索关键词不对,还得反复尝试。...提问环节在日常开发中,免不了遇到这样那样的问题,如果有什么问题,可以直接丢给一个智能助理就好了!而腾讯混元助手正好就具备这个能力,来看看我是怎么使用的吧。...问题 9:jQuery 修改某个标签属性值背景:jQuery 是一个比较老的前端库,还是有很多旧的网站还在用它,长时间不用难免会遗忘。...2.在该文件夹下创建 manifest.json 文件来定义你的插件。3.创建一个新的 HTML 文件,例如 popup.html,用于创建下拉菜单小窗口。...4.在 popup.html 文件中添加以下代码,创建一个下拉菜单小窗口:5.创建一个 popup.js 文件,用于处理点击图标后打开的插件窗口。

69320

CSS 下拉菜单与 focus

在移动端上稍微有些不同,毕竟所有控制——无论单击、长按抑或划动——都由接触开始,也没有鼠标的「悬停」逻辑,为了方便判定,移动端上若想激活 :hover 也是单击(触摸)。...,虽然 active 在移动端的响应是三个中和桌面端最贴合的,并不适用于此场景。...这里有两个问题: 为什么要加 tabindex? 为什么值要填 0? Spectre 解释是这样让按钮可获得焦点,事实上,并非所有元素默认支持聚焦。...而 标签在这里只是作为一个按钮使用,并不想被点击后有任何跳转,所以不会给它带上 href 属性,自然也就不可聚焦。...因此,「Cards」主题在 iOS Safari 上会发生点击下拉菜单可以展开、但是点击空白地方无法收回的问题,除非之后点击的是链接之类的。

5.4K20

为 WordPress 增加按分类搜索功能并自定义外观

输出对应的结构 先要自己做一个结构,然后使用 CSS 进行修饰,达到你想要的下拉菜单的样式。这里我是用了两个 div 和 ul 来模拟。其中一个表示当前的选项,另一个表示下拉菜单的内容。...然后在下拉菜单里面,使用一段 php 来调用输出对应的 分类目录名称 和对应的 目录id 。具体代码可以参考下面这段,可以根据自己的结构进行合理的修改。 <?...这个地方用 jQuery 获取对应的 select 的内容也是可以实现的,但是直接用 php 感觉比较好一点,用 jQuery 操作,在没有加载完 js 的时候是不会生效的。...一开始想到的是使用 JavaScript 按照 WordPress 搜索格式构造一个 URL,然后发现这是多么的白痴。直接使用 jQuery 同步 select 的选项就好了。...,你自己看着办吧,如果有什么问题可以到 WPJAM问答 提问,这里有专家们为你解答 ----

1.2K10
领券