Html+css+javascript

Sup_

Sup_|freeCodeCamp上的Random Quote Machine(随机引用器)

发布于 2017-01-07 21:50:18 浏览:104 类型:原创 - 教程 分类:JavaScript 举报

html代码效果预览<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="content-type"content="text/html;charset=UTF-8"/><title>Sup_</title><!--<linkhref="style.css"rel ...

hyperh5

hyperh5|JS类似于黑客帝国字幕(原生JS)

发布于 2017-01-06 20:15:52 浏览:146 类型:原创 - 随笔 分类:JavaScript 举报

前几天看到有朋友发了个黑客帝国的代码,不过是用canvas画的,小弟的canvas功底实在有限,结合面向对象也就只能画出一个不会动的物体。所以自己就单纯用面向对象写了一个类似于黑客帝国的代码。代码还有一些问题,所以只能用谷歌浏览器才能看得出效果,希望论坛里有大神可以帮我看一下有哪些地方可以改进;html代码效果预 ...

hyperh5

hyperh5|原生自动版卖机

发布于 2017-01-05 12:20:54 浏览:278 类型:原创 - 随笔 分类:JavaScript 举报

本代码是用面向过程编写,这两天会整理封装一个面向对面的版本。刚接触w3cfun,笔记写的不是很好,需要看完整的代码可以下载附件查看,如有改进的地方请指正,谢谢!自动贩卖机需求如下:1.贩卖机分三个部分,购买区域,投币区域和出货区域2.购买区域是3*4的商品网格,每个网格包含商品图片和一个购买按钮3.投币区 ...

wishuice

wishuice|简单的动态导航

发布于 2017-01-04 17:23:38 浏览:2028 类型:原创 - 随笔 分类:HTML/CSS 举报

写个笔记就和改bug一样麻烦html代码效果预览<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"><metaname="apple-mo ...

FJH30

FJH30|小白!关于JS的知识,请各路大神指教

发布于 2016-12-27 16:42:06 浏览:316 类型:原创 - 随笔 分类:JavaScript 举报

今天我写了个JS代码,这里我就不写出来了,不过我就举个例子!例如:一个回到顶部图标!!我在CSS里面定义了display:none;然后在JS里定义了,当下拉到一定高度就会出现(display:block)..大致的代码是这样:::window.onload=function(){vartop=document.getElemen ...

认真你就输了丶

认真你就输了丶|CSS3实现的开关(非常逼真)

发布于 2016-12-21 21:06:21 浏览:3094 类型:原创 - 随笔 分类:HTML/CSS 举报

html代码效果预览<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"/><title>开关</title><styletype="text/css"media="screen">html,body{width:100%;height:100%;margin:0;padding:0;background:#ca9f6a;background: ...

taishanuni12

taishanuni12|兼容所有浏览器-圆形加载条

发布于 2016-12-21 13:28:46 浏览:286 类型:原创 - 随笔 分类:JavaScript 举报

这篇笔记是鄙人用通过将不同状态图片定位不同,使用setInterval设置了一个定时器,在条件不满足情况下,使用clearInterval清除,希望大家多多发表留言。。。html部分<divclass="company-righttext-right"><divid="load"class="loadingNewtext-center"></div><divclass="iw_company_ ...

兼容所有浏览器-圆形加载条
qq120qqii

qq120qqii|Jquery自动判断多少li轮播

发布于 2016-12-17 11:59:00 浏览:239 类型:原创 - 随笔 分类:JavaScript 举报

公司做项目需要用到轮播效果,但美工切图都是用ul进行包裹起来多个li标签,然后以ul进行轮换。调取数据时需要进行判断。html代码效果预览<!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><html><head><metahttp-equiv="Content-Type"content="text/html;c ...

sl2782087

sl2782087|真正的抽奖都是有猫腻的,转盘抽奖demo改良版。

发布于 2016-12-12 17:41:04 浏览:385 类型:原创 - 随笔 分类:HTML/CSS 举报

最近公司有让做一个抽奖转盘,正好看了@1292150917a的抽奖系统(逻辑)代码以打好拿走就是用,有所启发。不过公司要求抽奖是可控制的,就是说不同奖品获得的概率不能相同,像特等奖这种的最好就不要有人能抽中,于是改良了一下@1292150917a兄弟的代码,模拟出一个可以控制概率的抽奖活动(其实抽奖的逻辑是后端实现的,我 ...

1292150917a

1292150917a|3D旋转相册(适合新手)

发布于 2016-12-01 13:56:12 浏览:1025 类型:原创 - 随笔 分类:JavaScript 举报

3D旋转相册完美代码效果预览<!DOCTYPEHTML><htmlonselectstart="returnfalse"><head><metacharset="utf-8"><title>3D拖拽相册</title><style>html,body{width:100%;height:100%;overflow:hidden;cursor:url("img/sb.png"),auto; ...

xiaolongyuanzi

xiaolongyuanzi|PC端页面布局,样式,JS的一些小问题

发布于 2016-11-29 12:00:03 浏览:272 类型:原创 - 随笔 分类:HTML/CSS 举报

真正工作了才知道自己和专业人士差了多少啊边工作边踩坑,一遍吐血的提高自己。。。不停歇的记录中。。。一、样式里面有很多的坑啊~(基础不扎实的我,踩坑记)1。老司机同事给我普及的那些套路~~~adisplay和float两个属性在同一个元素上作用时,float会直接屏蔽掉display的inline-block之类的样式,会让inline-block没 ...

Emperor征服

Emperor征服|无缝轮播图

发布于 2016-11-27 20:37:47 浏览:1752 类型:原创 - 随笔 分类:JavaScript 举报

<!DOCTYPEhtml><html><head><metacharset="utf-8"><title></title><styletype="text/css">&nbs ...

最近做一个管理系统的项目,项目里面有图片查看的界面,先是图片缩略图,点击图片缩略图后再当前iframe范围内显示该图片及其内容介绍,再接着点击带有内容的显示的图片后会有一个全屏弹出层弹出,此时的图片是自适应全屏显示的(高度与所在电脑分辨率的高度一致,而且图片的宽度是随其高度而等比例变化的),于是乎我在网上 ...

刚开始工作没多久,还在不断的学习中,和大家分享一下我的学习经验。有不足之处希望各位能够给予指正,谢谢啦~~这个笔记记录的都是我平时在工作中会遇到和用到的一些简单的页面效果。我会一直的跟新的。。。一、鼠标交互:鼠标hover,表单获取focus,页面元素点击等。1.鼠标hover,focus时,文字移动,边框变化等。主要会 ...

一些js+html+css/css3实现,常用的页面效果(持续更新.....)
FJH30

FJH30|求大神指教指教

发布于 2016-11-17 16:30:02 浏览:157 类型:原创 - 随笔 分类:JavaScript 举报

javascript如何获取HTML表格中得第一列?document.getElementsByTagName??document.getElementsByTagName??document.getElementsByTagName??document.getElementsByTagName??document.getElementsByTagName??////////row???////////th???? ...

IT白菜哥

IT白菜哥|jq实现模态框且去body滚动条

发布于 2016-11-17 14:33:50 浏览:245 类型:原创 - 随笔 分类:JavaScript 举报

效果展示:html代码<buttonclass="on_btn"data-type="#model1">点我出现模态框</button><div>我是页面内容& ...

jq实现模态框且去body滚动条
asd2340138

asd2340138|仿它个暴雪守望先锋官网

发布于 2016-11-16 10:27:06 浏览:2913 类型:原创 - 随笔 分类:HTML/CSS 举报

最近定了个小目标,仿了个暴雪的游戏官网。在这个项目中,主要运用了一些CSS3的属性和一点JS。想看页面效果的可以访问我的码云空间查看,上链接:仿守望先锋官网。之前写页面头部的人物跟随鼠标移动动画的时候,用的是改变背景定位的值来实现的。后来发现,这样的动画始终有点不流畅,代码如下:html代码效果预览$(wi ...

仿它个暴雪守望先锋官网
1032911889

1032911889|一个小demo,折叠式的菜单

发布于 2016-11-15 16:26:19 浏览:279 类型:原创 - 随笔 分类:JavaScript 举报

第一次做笔记,传一个以前的demo。html代码效果预览<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>菜单</title><styletype="text/css">#main{width:580px;height:403px;margin:200pxauto;position:relative;background-color:#22FCDF;overflow:hidde ...

郑逸尘

郑逸尘|第一次写笔记

发布于 2016-11-13 16:38:38 浏览:170 类型:原创 - 随笔 分类:HTML/CSS 举报

第一次写笔记说点什么好呢?讲点段子吧。0、没有对象怎么办?你不会new一个出来啊。1、世界上最遥远的距离是,你在if里,我在else里,虽然同步出现却永不结伴执行。2、还有什么请大家补充。。。。。 ...

pbaibu

pbaibu|右侧悬浮框

发布于 2016-11-08 23:17:00 浏览:481 类型:原创 - 随笔 分类:HTML/CSS 举报

html代码效果预览<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>右侧悬浮框</title><style>body{margin:0;padding:0;height:1900px;}p{font-size:20px;color:#f00}#div1{width:125px;height:250px;background:#f00;position:absolute;right:0;bottom:0}</styl ...