- 浏览: 166676 次
- 性别:
- 来自: 成都
文章分类
最新评论
-
crabboy:
goodhttp://veerle.duoh.com/comm ...
表格效果 -
lunvsxiao:
好呀,省的自己记那么多了。。
java常用正则表达式
动态加载css的实现思路,目前想到有两种:
一、js
主要内容如下:
第一种:一般用在外部CSS文件中加载必须的文件
程序代码
@import url(style.css);
/*只能用在CSS文件中或者style标签中*/
第二种:简单的在页面中加载一个外部CSS文件
程序代码
document.createStyleSheet(cssFile);
第三种:用createElement方法创建CSS的Link标签
程序代码
var head = document.getElementsByTagName('HEAD').item(0);
var style = document.createElement('link');
style.href = 'style.css';
style.rel = 'stylesheet';
style.type = 'text/css';
head.appendChild(style);
这里贴上我以前在项目中使用的几个函数,希望对大家有用!
程序代码
function loadJs(file){
var scriptTag = document.getElementById('loadScript');
var head = document.getElementsByTagName('head').item(0);
if(scriptTag) head.removeChild(scriptTag);
script = document.createElement('script');
script.src = "../js/mi_"+file+".js";
script.type = 'text/javascript';
script.id = 'loadScript';
head.appendChild(script);
}
function loadCss(file){
var cssTag = document.getElementById('loadCss');
var head = document.getElementsByTagName('head').item(0);
if(cssTag) head.removeChild(cssTag);
css = document.createElement('link');
css.href = "../css/mi_"+file+".css";
css.rel = 'stylesheet';
css.type = 'text/css';
css.id = 'loadCss';
head.appendChild(css);
}
二、服务器端实现变量加载
也在两种方法:
(一)直接使用变量
< head runat ="server" >
< title ></ title >
< script language ="javascript" src ="<%=url%>/js/jquery.js" ></ script >
< script language ="javascript" src ="<%=url%>/js/jquery-impromptu.2.7.min.js" ></ script >
< link type ="text/css" rel ="stylesheet" href ='<%=url % > /css/css.css' />
< link type ="text/css" rel ="stylesheet" href ="<%=newurl %>/css/css.css" />
</ head >
(二)使用link的runat="server"属性,使其变成服务器控件
view plaincopy to clipboardprint?
<link id="myPageCssPath" runat="server" rel="stylesheet" type="text/css" />
<link id="myPageCssPath" runat="server" rel="stylesheet" type="text/css" />
后台代码:
view plaincopy to clipboardprint?
protected HtmlGenericControl myPageCssPath;
myPageCssPath.Attributes["href"] = ".";
protected HtmlGenericControl myPageCssPath;
myPageCssPath.Attributes["href"] = ".";
助人等于自助!
本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/downmoon/archive/2009/07/18/4359080.aspx
/******************************************************
/** * 动态加载js文件或者css文件 */ function loadjscssfile(filename, filetype) { var fileref; if (filetype == "js") { fileref = document.createElement('script'); fileref.setAttribute("type", "text/javascript"); fileref.setAttribute("src", filename) } else if (filetype == "css") { fileref = document.createElement("link"); fileref.setAttribute("rel", "stylesheet"); fileref.setAttribute("type", "text/css"); fileref.setAttribute("href", filename) } if (typeof fileref != "undefined") document.getElementsByTagName("head")[0].appendChild(fileref); }
/******************************************************
发表评论
-
img 图片显示多余空白解决方法
2014-09-03 23:01 0img 图片显示多余空白解决方法:在进行DIV+CSS排版时 ... -
js event.keyCode
2011-12-02 17:13 675keycode 8 = BackSpace BackSpace ... -
js event.keyCode
2011-12-02 17:06 2keycode 8 = BackSpace BackSpace ... -
IE6下png透明处理心得
2011-11-24 12:41 1266首先说明一下,网上处理IE6下png透明的方法有很多,但无外乎 ... -
我的笔记
2011-10-25 22:52 0http://www.ccxcn.com/blog/post/ ... -
HTTP状态码(HTTP Status Code)
2011-02-23 09:40 6851xx(临时响应)表示临时响应并需要请求者继续执行操作的状态代 ... -
上传图片预览-兼容IE6,IE7,IE8,FF
2011-01-20 14:07 691<!DOCTYPE html PUBLIC " ... -
动态加载javascript文件
2010-12-23 23:53 688动态加载javascript?很俗的一个题目,如果你已经知道如 ... -
Apache相关配置
2010-11-30 22:15 707强制IE缓存CSS中定义的图片 document.execC ... -
表格效果
2010-07-14 18:07 758web应用中的表格效果。 鼠标滑动时选中横行和竖列。 见附 ... -
所有浏览器中都能正常显示的字体
2010-07-04 01:31 930很佩服国外一些前端开发人员对待学问的研究精神,他们很善于总结发 ... -
隐藏IE窗口自带的“Windows Internet Explorer”
2010-05-17 10:34 1680var whiteStr = ""; f ... -
当加载flash或者弹出窗口时,Internet Explorer显示安全提示
2010-05-05 11:50 1889当我们在开发web前端时,有时加载的swf文件或者某些js文件 ... -
子页面和父页面的相互调用
2010-04-07 13:53 2428父页面 <!DOCTYPE html PUBLI ... -
CSS选择器笔记
2010-03-20 11:17 1382http://www.456bereastreet.com/a ... -
美化表单
2010-01-14 22:42 1257首先介绍一个设计很不错的网站:http://utombox.c ... -
你是如何让position:fixed在IE6中工作的
2010-01-09 17:20 2257你是如何让position:fixed在IE6中工作的? 本 ... -
滚动列表
2010-01-04 13:13 1084<MARQUEE onmouseover=this.st ... -
淡入淡出DIV层效果
2009-12-29 18:09 2064<html> <head> &l ... -
生成Table,然后赋值
2009-12-23 10:42 1375主要用于需要对比的时候: <!DOCTYPE H ...
相关推荐
思路是创建一个 link 元素,并将它添加到 标记中即可,下边首先看看怎么使用 jQuery 来实现。 下边是我喜欢的写法: $("<link>") .attr({ rel: "stylesheet", type: "text/css", href: "site.css" }) ....
另外一种实现思路是添加四个div来分别实现上下左右的边框效果,虽然可行,但是要添加四个额外元素,有点儿得不偿失的感觉。难道就没有更好的解决方案了… 就在我绞尽脑汁的时候,灵光乍现,为什么不尝试一下用CSS3多...
思路: 一个外层盒子设置背景;一个内层盒子设置宽高背景,并设置animate让盒子移动
本文实例讲述了jquery+css实现动感的图片切换效果代码。分享给大家供大家参考。具体如下: 运行效果截图如下: 具体代码如下: 基本思路:定义一个数组存放需要展示的图片,接着当单击图片时删除zoomIn类,添加...
【明确需求】 网页加载样式表default.css,... 【实现思路】 使用[removed]动态向<head />中写入css载入语句; 通过生成的随机数,随机加载样式表; 使用cookie机制记录当前风格,确保下次下次风格与当前风格一
使用jQuery的toggleClass()方法,添加删除类active 分别为原本的和active的元素设置样式,使用css的transition属性,定义变化时间,速度等 使用css的animation为active元素设置变化动画 :man_technologist:实现 ...
最近看一个网站,发现显示器不同的分辨率,...link rel=”stylesheet” id=”sc” type=”text/css” href=”css/c1.css”/> [removed] [removed]=function(){ var sc=document.getElementById(“sc”); var d=docu
vue如何简单的实现弹框,遮罩,点击其他区域关闭弹框, 简单的思路是以一个div作为遮罩, 控制其的v-if(v-show)即可, 掌握到技巧既可以任意扩展。 v-if 是直接删除dom节点, 就是这个div就不存在了 v-show 是控制dom的...
但是往往要引入一大堆js和css,其实在已有的项目中,可能只是想加一个这样的按钮,来增强用户体验,这些js库就显得有些过于庞大了,同时由于是js实现,很多时候还要注意加载问题。 那么,有没有办法用css来实现这一...
项目在实现步骤由浅入深,逐步进行模块跟进及相关的代码添加补充实现,包括项目功能分析、代码实现、运行结果展示以及总结和扩展;同时在编写代码的同时,配有详细的注释和思路以及需要注意的细节等。
demo 框架选择: create-react-app + mobx + webpack5 + antdesign 说明 由于最近公司有多个主题的... Less切换 单纯引入所有的less文件去做切换,这样不能实现css的动态加载了,会增加无用css文件的加载 最后通过比
在加载网络数据时,为了提升用户体验,通常会使用一个转圈圈的loading动画,或者使用Skeleton Screen占位。相比与loading动画,Skeleton Screen的效果要更生动,实现起来来也很简单。利用CSS就可以实现一个简单的...
按照一般的思路,设置好li的宽度,通过nth-of-type(n){}的方式给li标签添加样式。 设置每个li 33.33%的宽度,但当我们添加1px边框时,最右边的内容就被挤了下来。 这时可以通过给父级 ul 添加:before :after 伪类...
本文给大家分享的是通过浏览器的扩展程序中添加CSS样式,来实现隐藏掉贴吧页面上的垃圾内容,思路非常不错,有需要的小伙伴快来参考下吧。
6 二、易于修改 7 三、减少网页加载时间 7 四、代码精简 7 五、相对表格的嵌套问题 8 六、搜索排名的影响 8 第四节 div+css布局方式 8 第五节 div+css理论概述 9 一、理解CSS盒子模型 9 二、转变思路 10 三、实现...
该效果的主要实现思路是给文字添加渐变的背景,然后对背景进行裁剪,按文字裁剪(目前只有webkit内核浏览器支持该属性),最后给背景添加动画,即改变背景的位置,背景动画效果如下(GIF录制时有卡顿,代码实现时不...
本文分享一个JavaScript的留言板添加留言、删除留言的小案例,内附详细代码分析、但不涉及数据库操作,只解析底层代码实现思路: 运行代码界面: 输入留言进行添加:(最新的留言会在最顶部显示) 删除留言:...
1.首先通过HTML+CSS实现加载动画的静态效果; 2.根据需求给每个动画设计不同的动画效果。 例如第一个加载图标的静态绘制 1、首先确定动画的盒子宽高; 2、设置盒子中每一个长方形的宽高以及定位(注意:此处需要...