此方法用来修改css属性,例:
<script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $("p").css("color","red"); }); }); </script>
如果不修改而只是获取css属性的值,那么括号内只写属性就行了
此方法用来修改css属性,例:
<script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $("p").css("color","red"); }); }); </script>
如果不修改而只是获取css属性的值,那么括号内只写属性就行了
下图是fate stay nigth官网,作为一个游戏网站,突出了最新资讯的大图。
左侧是logo、导航、新闻推荐、活动链接、最新资讯的pv,右侧是最新资讯的大图展示,占据了大部分版面。大图不是背景图,而是右侧主体div里面的img标签,用width:100%;height:auto;来适应布局。当然作为body主体的wrap也设置了最小宽度。图片应该高度大于宽度,确保页面在最小布局的时候图片不会小于一屏。
底部贯通全屏,主体部分是横向排列的logo、大分类链接、新闻推荐、社交网站帐号、分享按钮。最底部是版权信息。
从整体配色上来看,黑白搭配,顶部色调深沉,底部则是淡雅的浅白色(查看所用的背景图片)。
所谓的大分类链接,就是和本站同等级的产品了,这几个链接除了出现在底部,还在顶部有显示。点击顶部的下拉三角按钮就会展开。
其实body里面是有一个全站通用背景的,在首页我们看不到,因为左侧被特意加了黑色背景,右侧则被大图遮挡了。在内页可以看到固定的背景图
备注:
在内页,左侧是有淡淡的黑色背景的。一般来说,我会考虑rgba属性,但是显然在ie里面会有兼容性问题。以前只能想到用背景图片来做兼容,现在查看此站左侧的css,如下:
第一句也是rgba,第二句也是,但是前缀"-pie-background"我看不懂,百度之,发现这句和第三句是联系在一起的,这个PIE.htc是在IE中实现css3一些效果的文件。又百度之,有空了可以参照此文研究研究。如果能用得了这个,则圆角、半透明背景色就可以不用切图了,善莫大焉。当然使用这个也是有一些限制的,要先仔细看看这篇文章。
查看百度百科正文片段的规则时,发现这样的定义:
对最后的sans-serif不解,百度之,找到了博客园的一篇文章,原来sans-serif是无衬线字体族,Serif是有衬线字体族。
常见的无衬线字体有 Trebuchet MS, Tahoma, Verdana, Arial, Helvetica, 中文的幼圆、隶书等等。font-family最后加上sans-serif,也是为了保证能够调用这个字体族里面的字体。
http://pan.plyz.net/
这个网站需要绑定百度网盘,也就是取得百度网盘授权。授权之后,在网盘里“我的应用数据”里面会生成一个plcould文件夹。
把文件上传到这个目录(或者把已有文件转移到这个目录),然后回到这个网站,刷新管理页面,即可看到存在的文件和文件直链。
文件的直链不同于分享链接,点击之后是直接把文件下载的,不需要打开分享页面再下载。这对单个文件的分享是很方便的,不知能不能提高防和谐能力。
把长链接处理成短链接无疑增加了可读性。短链接的机制是通过算法生成网址的短网址,这个短网址还是需要服务商转换为原链接的。不同的服务商如腾讯和新浪,生成的短网址是不同的。我比较担心短网址会不会失效,不过现在这种情况貌似很少出现,姑且用着吧
前几天去琉璃神社听到了一声“哦尼酱,dai~suki♥”,审查元素发现是用的html5播放的mp3文件。之后不知为何←_←我就去搜集了saber的声音,今天抽空加在了本站上有木有发现今天一连发了好几篇js相关的文章?其实都是添加的过程中搜索到的←_←。
我准备了四个声音文件,对应时间分别是:
5-7点之间: 早上了,master
7-9点之间: 早上好
9-21点之间: 辛苦了,master
其余时间: 晚安
然后在底部模板添加了一个不可见的div,接着用js判断时间,最后把播放对应音频的代码添加到div里面。
<div id="sv" style="display: none;"></div> <script type="text/javascript"> if (window.location.href=="/") { //通过判断时间添加对应的saber的声音 var myDate = new Date(); var nowtime=myDate.getHours(); if (nowtime>=5&nowtime<7) {//早上了,master $("#sv").html("<audio autoplay='autoplay' src='/f/sv_%E6%97%A9%E4%B8%8A%E4%BA%86%EF%BC%8Cmaster.mp3'></audio>"); }else{ if (nowtime>=7&nowtime<9) {//早上好 $("#sv").html("<audio autoplay='autoplay' src='/f/sv_%E6%97%A9%E4%B8%8A%E5%A5%BD.mp3'></audio>"); }else{ if (nowtime>=9&nowtime<21) {//辛苦了,master $("#sv").html("<audio autoplay='autoplay' src='/f/sv_%E8%BE%9B%E8%8B%A6%E4%BA%86%EF%BC%8Cmaster.mp3'></audio>"); } else{//晚安 $("#sv").html("<audio autoplay='autoplay' src='/f/sv_%E6%99%9A%E5%AE%89.mp3'></audio>"); }; }; }; }; </script>
jq中可以使用html()输出html代码,形如
$("#sv").html("<audio autoplay='autoplay' src='src'></audio>");
只是注意,双引号中间是html代码,html代码中出现的引号就只能用单引号了。
参考:http://holysonll.blog.163.com/blog/static/2141390932013411113333559/
<div id="a" style="background:#DAE0F1;"> <p id="b">bbbbbbbbbbbbbbbbb</p> </div> <script type="text/javascript"> function createE (tagName,id,className,style,innerHTML,addway,parentId,reforeId) { var newElement=document.createElement(tagName); newElement.id=id; newElement.className=className; newElement.style.cssText=style; newElement.innerHTML=innerHTML; if (addway=='end') { if (parentId=='body') { document.body.appendChild(newElement); }else{ document.getElementById(parentId).appendChild(newElement); } } if(addway=='before'){ if (parentId=='body') { document.body.insertBefore(newElement,document.getElementById(reforeId)); }else{ document.getElementById(parentId).insertBefore(newElement,document.getElementById(reforeId)); } } } createE('div','aa','link','font-size: 30px;','追加在a的末尾','end','a',''); createE('h1','','','font-size: 30px;','插入在a中的b之前','before','a','b'); createE('h1','c','','font-size: 30px;','追加在body末尾','end','body',''); createE('h1','d','','font-size: 30px;','插入在body中的a之前','before','body','a'); </script>
输出如下:
今天写了个使用js创建页面元素的函数,如果有多个元素需要使用js来创建的话,倒还是可以方便一些的。函数参数如下:
元素的标签名,元素的id,元素的class名,元素的内部样式,元素的内部代码,追加方式(填写“end”或者“before”),追加到的父元素的id,父元素中子元素的id(仅当追加方式为before时填写)。
如果追加方式为end,则使用appendChild()方法追加到父元素内;如果追加方式为before,则使用insertBefore()方法插入到父元素内某个子元素之前。
考虑到body是创建元素时常用的一个节点,如果把父元素的id填写为“body”则会按body来处理。
var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整的年份(4位,1970-????) myDate.getMonth(); //获取当前月份(0-11,0代表1月) myDate.getDate(); //获取当前日(1-31) myDate.getDay(); //获取当前星期X(0-6,0代表星期天) myDate.getTime(); //获取当前时间(从1970.1.1开始的毫秒数) myDate.getHours(); //获取当前小时数(0-23) myDate.getMinutes(); //获取当前分钟数(0-59) myDate.getSeconds(); //获取当前秒数(0-59) myDate.getMilliseconds(); //获取当前毫秒数(0-999) myDate.toLocaleDateString(); //获取当前日期 myDate.toLocaleTimeString(); //获取当前时间 myDate.toLocaleString(); //获取日期与时间