网页对联效果简单实现

记一下网页对联的实现,方便下次找。

主要通过三个属性实现right: 20px;top:180px;position:fixed;

<div id="tjzs" style="width:160px; padding-bottom:20px;z-index:100;right: 20px;top:180px;position:fixed;">
        <div id="tjzs_title" style="width:160px;height:25px;line-height:25px;background-color :#6C7C8D;text-align:center;font-size:14px; color:white;">提交助手</div>
        <div id="tjzs_tip" style="width:130px;height:27px;line-height:27px;font-size:12px; padding-left:30px; background-color:#F5F7FA;">当前项提示</div>
         <div id="tjzs_content" style="width:150px;font-size:12px; padding: 10px 5px; background-color:#E0E6EE; color:#767676;" >请仔细填写各项信息<br/>确认无误后提交<br /></div>
            <div id="tjzs_buttom" style="width:130px;height:27px;font-size:12px; padding-left:30px; background-color:#F5F7FA;"></div>
    </div>
时间: 2024-12-19 04:16:30

网页对联效果简单实现的相关文章

网页3D效果库Three.js初窥

网页3D效果库Three.js初窥 背景 一直想研究下web页面的3D效果,最后选择了一个比较的成熟的框架Three.js下手 ThreeJs官网 ThreeJs-github; 接下来我会陆续翻译 Three.js官网的文档,部分文字和代码为我个人添加. 第一部分:three.js介绍 创建场景 这部分的目标是为Three.js做一个简单的介绍,我们会以创建一个场景,一个旋转的立方里开始,文章的结尾会有一个可运行的完整示例为你解惑. 开始之前 在你使用Three.js之前,你需要在你的电脑上建

CSS3实现几个常用的网页小效果

主题 由于最近比较忙,自己也没有很充裕的时间可以去做比较丰富的分享.今晚我挤出时间来制作这几个很常用的CSS3网页小效果.最近写JS的时间比例比较多,不过我还是比较钟情于CSS3.所以我还是坚持分享一些实用的CSS3小例子.这次由于时间有限,就做了几个相对比较简单的例子.看一下吧! 正文 第一种效果: 由于录制gif图片会掉帧,所以看起来不流畅,很卡,但其实实际效果还是不错的,有弹性一些. html代码: <span class="shake">弹</span>

weui 多网页切换效果分析

weui的文档写的不怎么详尽,简单的来讲WeUI 为微信 Web 服务量身设计的h5框架. WeUI是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信 Web 开发量身设计,可以令用户的使用感知更加统一.包含button.cell.dialog. progress. toast.article.icon等各式元素. 严格的讲它是一个css库.算一个精简的库. 如果要用jQuery开发的话,head部分,需要加载如下信息: <head> <meta charset=&quo

Ajax风格的一款网页Loading效果

现在比较流行的一款Ajax风格的网页Loading,多见于一些大量使用Ajax技术的网站中,页面加载时会自动显示提示信息,带载入动画效果,网页加载完自动消失,是一款正在具有Loading功能的网页进度条. <html></P> <P><head> <title>Loading</title> <style type="text/css"> body{background-color:#000;} #co

网页效果-简单的时间轴实现

之前在网上看到,有很多人写的时间轴效果,于是自己也模仿着写了写.以下贴出自己写的解决方法(横向轴与纵向轴). 简单的时间轴效果容易实现,但如果需要看起来有模有样,就需要对页面进行设计布置了. 1.利用Js加简单的界面布置,实现时间轴鼠标点击轮换图片效果(纵向). 实现思路:利用多个div加背景色做纵向时间轴的样式,用CSS进行定位布局(时间轴一般都相对于浏览器窗口位置进行定位,避免浮动),再加上相应的文字描述.(:after,:before等一样能实现其效果),最后在用Js添加一些简单的鼠标事件

【pano2vr】网页Flash中简单实现炫酷的3D模型制作

花了两天时间学习如何能够高效的实现3D模型效果,毕竟是从0开始学习,感觉pano2vr这款软件挺容易上手,并且可以很容易实现简单的热点交互,可以根据交互需求设置皮肤,故将这一款软件推荐给大家: 1.简介.http://ggnome.com/pano2vr.用户可以自行下载. 2.简单教程. 3.皮肤编辑.用户可以根据提供的系统皮肤或者自制皮肤或网上资源实现,皮肤可以说是一个默认的播放器. 4.应用.用户可以将其应用于Flash以及网页中,根据官方提供的信息进行摸索制作. Flash API:ht

Markdown:纯文本进行网页排版的简单标记语言

Markdown http://daringfireball.net/projects/markdown/ 2016-08-03 Markdown是一种标记语言,对纯文本使用简单的标记符号进行网页格式排版,然后使用编译器可将其转换为丰富格式的结构化HTML文档. Markdown以纯文本格式文件储存,默认后缀名为md,其格式易读.编辑简单.使用Markdown编写需要格式化的帮助或说明文档之类,甚至撰写文稿.出版物等变得比较简单. Github网站使用添加了部分功能的Markdown编辑器,多数

页面效果简单做(不断收集更新)

简介:有自己写的,也有网上看到的,即使是别人写的也会对其改动,或添加注释,并保持统一的编码风格,便于阅读.目标是不用库即可完成,简单做,能够阐述逻辑和原理清楚即可,因此可能考虑不是最周详的,包括跨浏览器的问题,如果你打算使用在项目中使用最好测试清楚,还可能要进一步修改之. 注意:打算提供在线例子的,但短时间内没有静态空间,所以例子的事情要稍等一阵子.已提供在线例子. 1.简易拖放效果 使用了 DOM 1 的方式登记事件,其实无必要 addEventListener,因为根据鼠标事件,同一时刻通常

使用chrome查看网页上效果的实现方式

chrome是一个极为强大的工具,很多时候,我们不知道一个效果怎么实现的,我们完全可以找到响应的网页,然后找到其html文件,和js文件,查看源码,获得其实现方式. 下面举例说明: 1. 我想知道下面这一部分的HTML代码: 可以直接打开开发者工具,点击箭头后,选中该部分,则会自动定位到element中的相应元素. 2.我想知道这一部分的ajax实现,那么我可以直接通过猜测(准确率不是很高哈,要多试试~),找到HTML中引入的JS代码,在source资源中通过ctrl+P进行搜索文件.进入该文件