zoukankan      html  css  js  c++  java
  • 转:iFire:玩聚 SRBacks 自定义脚本及样式表

    感谢iFire的第一时间修改并试用,而且调试出如此清新的样式。
    下面转贴一下他的自定义脚本和样式表:

    玩聚 SRBacks 自定义脚本及样式表

    admin @ 2009-01-11 02:34 59

        今天玩聚推出了社会化推荐聚合服务中的一项有趣的页面挂件应用:SRBacks,十分实用也十分有趣。我当即引入自己的博客页面,不过发现其中的嵌套有误、呈现效果不够理想,于是将脚本下载下来自定义,改完之后自己感觉还不错。

        对于外来挂件,其内嵌的样式有时候会给自己的页面造成挺大的麻烦,因此我尽量删减脚本中的内嵌样式,而是将其赋予伪类值(class),然后将样式写入样式表,这给自定义样式的用户会带来较大的空间。

        在 Twitter 上讨论了一番之后,我自行修改脚本,用笨办法解决了在列表里隐藏博主条目的问题。同时,也给用户头像、Google Reader 图标赋予了伪类值,这样自定义的时候可以轻松地将它们隐藏或是设置图像尺寸。

        我修改的版本大体上算是自适应的,只是我测试宽度为 180px 的时候出现溢出,这应该是推荐文字中的长链接字符造成的,因此如果您是在侧栏调用,最好在设置一下条目 (#srbacks li.srbacklist )宽度,并加上 overflow: hidden; 应该就能解决。

        我建议将我提供样式表文件在页面<head>标签内单独引用,修改起来方便一些,我为所有的样式值之前都添加了 #srbacks 是为避免造成与您页面里的样式表冲突。

    下载压缩包

        上传压缩包中的 SRbacks.js 及 srback.css 这两个文件到您管理的空间,假设路径是:http://yourdomin.com/widget/

    在<head></head>标签内引入

    <link rel="stylesheet" href="http://yourdomin.com/widget/srback.css" type="text/css" media="screen" />

        然后在模板内引入

    <script type="text/javascript" src="http://yourdomin.com/widget/SRbacks.js"></script>

        Wordpress 用户可将其放在模板文件中的 comments.php 或是 sidebar.php 里。我推荐是在评论模板里调用。

        样式表文件中我已逐项标注了说明,修改时请参阅。下面是两张截图:

    200px 呈现样式

    500px 呈现样式


  • 相关阅读:
    子信息传递多个参数
    Oracle q' 简化单引号转义
    HTML的target属性中_blank、_self、_parent、_top含义
    数据库设计之“有时不得不违背的第三范式”
    Jquery下的Ajax调试方法
    JQuery.Ajax之错误调试帮助信息
    定时删除数据-用JOB
    数据分析
    机器学习数学基础
    机器学习数学基础
  • 原文地址:https://www.cnblogs.com/zhengyun_ustc/p/ifire_srbacks.html
Copyright © 2011-2022 走看看