为了方便以后自己使用!

<html>
<head>
<style>
.winmainshow { background: #fff; padding: 10px 5px 5px 25px; line-height: 25px; border: 1px solid #333; position: fixed; z-index: 1000; border-radius: 10px; color: #999; }
</style>
</head>
<body>
<!--遮罩背景-->
<div id="shadow" class="winbg" style="display: none">
</div>
<div id="UserFeedbackamin" class="winmainshow" style="display: none;">
</div>
<input type="button" id="afeed" value="弹出"> </body>
</html>

javascript代码:

$().ready(function () {
$("#afeed").click(function () {
var strc = ' <label> <input id="yjjy" class="c_opinion" name="one" type="radio" value="1" />意见建议</label>';
strc += '<label> <input id="tj" class="c_opinion" name="one" type="radio" value="2" />bug提交</label> <label><input id="tsjb" class="c_opinion" name="one" type="radio" value="3" />投诉举报</label>';
strc += '<label><input id="xqbx" class="c_opinion" name="one" type="radio" value="4" />寻求帮助</label>';
strc += '<br/><label id="labmsg"></label>';
windowCenteredfeed("#UserFeedbackamin", "", 600, 400, strc);
}); $("#closeIframe").live("click", function () {
$("#loginPanel").animate({ 'top': '50%', 'left': '50%', 'height': '0px', 'width': '0px', 'opacity': '0.1' }, function () { $("#loginPanel").hide(); $("#shadow").hide(); });
}); }); function windowCenteredfeed(obj, title, width, height, content) { $("#shadow").show();
$(obj).show();
$(obj).css('height', '0px').css('width', '0px').css('top', $(window).height() / 2 + 'px').css('left', $(window).width() / 2 + 'px').css('opacity', '0.1');
$(obj).html("<div class=\"winwork\">" + title + "<i id='closeIframefeed' class=\"close\">×</i></div>" + content); $(obj).animate({ 'height': height + 'px', 'width': width + 'px', 'top': ($(window).height() - height) / 2 + 'px', 'left': ($(window).width() - width) / 2 + 'px', 'opacity': '1' }, "slow");
}

一款公用的CSS+DIV弹窗的更多相关文章

  1. js动画 无缝轮播 进度条 文字页面展示 div弹窗遮罩效果

    1.无缝轮播 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.a ...

  2. 精通CSS+DIV网页样式与布局--图片效果

    提到图片效果,小伙伴们可能会想到美图秀秀,ps等,这些软件都是款非常不错的照片处理软件,包括常用的:黑白,增强,高斯,高对比,夜视,老照片和铅笔画等等.不管你是否是专业的 照片拍摄人员,我们都可以通过 ...

  3. 27款经典的CSS框架

    利用 CSS 框架,可以简化你的工作,提高工作效率.CSS 框架是一系列 CSS 文件的集合体,包含了基本的元素重置,页面排版.网格布局.表单样式.通用规则等代码块.下面给你推荐了27款优秀的CSS框 ...

  4. CSS + DIV 让页脚始终底部

    一 前言 经常设计页面时用到三层DIV,头DIV与脚DIV一般固定高度,而中间层DIV根据内容的多少,高度不定,我们经常希望但内容很少时,脚DIV保持在底部,当内容很多时,脚DIV被中间内容挤到下面, ...

  5. HTML CSS + DIV实现整体布局

    HTML CSS + DIV实现整体布局 1.技术目标: 开发符合W3C标准的Web页面 理解盒子模型 实现DIV+CSS整体布局 2.什么是W3C标准? W3C:World Wide Web Con ...

  6. CSS+DIV两栏式全屏布局

    在网上找了很久,发现大部分都是固定宽度设置两栏,全屏情况下的布局很少.最后终于完成了,写出来备查,也供大家参考. <!DOCTYPE html PUBLIC "-//W3C//DTD ...

  7. CSS + DIV 让页脚始终保持在页面底部

    来源:David's Blog     http://www.DavidQiu.com/ 文章链接:http://blog.davidqiu.com/post/2013-06-17/400517539 ...

  8. div垂直居中 css div盒子上下垂直居中

    div垂直居中 css div盒子上下垂直居中,让DIV盒子在任何浏览器中任何分辨率的显示屏浏览器中处于水平居中和上下垂直居中. div垂直居中常用于单个盒子,如一个页面里只有一个登录布局,使用div ...

  9. HTML CSS + DIV实现局部布局

    HTML CSS + DIV实现局部布局 HTML CSS + DIV实现局部布局 1.本章教大家掌握2种布局方式: 1)顶部导航菜单布局,效果图: 2)购物版块布局,效果图: 2.技术目标: 使用d ...

随机推荐

  1. Python中Paramiko协程方式详解

    什么是协程 协程我们可以看做是一种用户空间的线程. 操作系统对齐存在一无所知,需要用户自己去调度. 比如说进程,线程操作系统都是知道它们存在的.协程的话是用户空间的线程,操作系统是不知道的. 为什么要 ...

  2. linux 记录用户操作记录日志

    ####################################################################################historyUSER_IP=$ ...

  3. App开发三种模式

    APP开发三种模式 现在App开发的模式包含以下三种: Native App 原生开发AppWeb App 网页AppHybrid App 混合原生和Web技术开发的App 详细介绍: http:// ...

  4. 查找数组中重复项的index

    var ary = [5, 4, 4, 2, 7, 8, 33, 2222, 99, 88]; function isRepeat(arr) { var hash = {}; for (var i=0 ...

  5. python的字符串内建函数

    http://www.ziqiangxuetang.com/python/python-strings.html

  6. CSS 日常问题总结

    1.关于文本多余部分用省略号代替: http://www.cnblogs.com/hellman/p/5755376.html

  7. MySQL数据库的备份与还原

    http://www.cnblogs.com/lql123/p/6090681.html    //安装WordPress 1.备份 密码为:AAAzzz//123 mysqldump -uroot ...

  8. JavaScript Array对象sort() 方法小结

    sort() 方法用于对数组的元素进行排序. 语法arrayObject.sort(sortfunction) 参数sortfunction 可选.规定排序顺序.必须是函数. 返回值对数组的引用.请注 ...

  9. 使用VC6.0创建和运行C程序的方法

    使用VC6.0可以有快捷的方式创建C程序,对于初学者,建议按照如下方式创建.先创建一个工作区,然后创建工程,最后在工程中创建源文件文件.理解工作区.工程与文件之间的关系.

  10. swift-分支语句

    // switch的基本用法 // 1>switch后面的()可以省略 // 2>case中语句结束后不需要跟break // 3>在case中定义局部变量不需要跟{} // 4&g ...