scw1610
小狐狸
小狐狸
  • UID44044
  • 注册日期2014-01-24
  • 最后登录2020-04-28
  • 发帖数8
  • 经验10枚
  • 威望0点
  • 贡献值12点
  • 好评度0点
阅读:1203回复:0

求大神帮忙修改脚本

楼主#
更多 发布于:2014-01-24 13:36
一个侧边栏触发样式,是可以自定义触发图标的,如图

一个是悬浮论坛回复,默认的触发图标为细竖条,如图

我的问题是,如何让悬浮论坛回复的触发图标像侧边栏那样可以自定义触发图标,哪位大神可以修改一下,我觉得可以借鉴一下自定义侧边栏的样式,我把css发一下,上面的为侧边栏,下面的为论坛回复
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
 
 /*****FF侧栏自动隐藏样式,自定义图标版   by defpt at 2014.01.16*****/
 
 #sidebar-box{
 
     -moz-appearance: none !important;
 
     overflow:hidden !important;
 
     position:fixed !important;
 
     top:168px !important;/*到窗口顶端距离,建议自己调整为佳*/
 
     left: 1px !important;/*到窗口左边距离,建议自己调整为佳*/
 
     width:36px !important;/*图标大小之宽度*/
 
     height:36px !important;/*图标大小之高度*/
 
     opacity: 0.5 !important;/*建议自己调整为佳*/
 
     background-image:
url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACvSURBVFhHxcxBCsMwDEXB3P/Sab2IMGLi1CioH2bzLHx8d/4ZYyfGToydGDsxdmLsxLhtTP0HjNuu6e0B47Z5el9g3JanmxuM2zTdAWOoTn8mjOGN6d8JY3hj+nfCGKrTnwljyNPNoOkOGEOeboY83dxgDHm6GebpfYEx5OlmuKa3B4whTzfD6u0BY8jTTRFjyNNNEWPI000RY8jTTRFjJ8ZOjJ0YOzF2YuzE2OQ4P5o2hsCZD/qKAAAAAElFTkSuQmCC")
 !important;
 
     background-repeat: no-repeat !important;
 
     background-attachment:fixed !important;
 
     background-position: 1px 168px !important;/*图标位置,请保持和上面left和top数值相同*/
 
     border-radius: 1px !important;/*图标边框圆角设置*/
 
     transition-delay:0s !important;/*收缩延时,单位为秒,建议自己调整为佳*/
 
 }
 
 
 
 #sidebar-box:hover{
 
     opacity: 1 !important;
 
     top: 66px !important;/*侧栏展开后到窗口顶端距离,建议自己调整为佳*/
 
     left:-1px !important;
 
     height:auto !important;
 
     width:286px !important;/*侧栏展开后宽度,建议自己调整为佳*/
 
     border-right: 1px solid silver !important;
 
     transition-delay: 0.5s !important;/*触发延时,单位为秒,建议自己调整为佳*/
 
 }
 
 
 
 #sidebar-box > #sidebar-header,
 
 #sidebar-box > #sidebar{visibility: collapse !important;}
 
 
 
 #sidebar-box:hover > #sidebar-header {
 
     visibility: visible !important;
 
     border-top: 1px solid silver !important;
 
     width: 100% !important;
 
     font-weight: bold !important;
 
     transition-delay: 0.5s !important;/*触发延时,单位为秒,建议自己调整为佳*/
 
 }
 
 #sidebar-box:hover > #sidebar{
 
     visibility: visible !important;
 
     position:fixed !important;
 
     height:717px !important;/*侧栏展开后高度,建议自己调整为佳*/
 
     width:286px !important;/*侧栏展开后宽度,建议自己调整为佳*/
 
     transition-delay: 0.5s !important;/*触发延时,单位为秒,建议自己调整为佳*/
 
 }
 下面为论坛回复
 
 
 @namespace url(http://www.w3.org/1999/xhtml);
 
 /*论坛悬浮回复框by defpt*/
 @-moz-document regexp(".*forum.*"), regexp(".*thread.*"), regexp(".*tid=.*"), regexp(".*read.*tid-.*"),regexp(".*bbs.*") {
             /*左侧细条触发*/
        #anchor,#quickpost, #f_post, #f_pst {
             position:fixed !important;
             border:1px solid #51AFF7 !important;
             overflow:hidden !important;
             left:auto !important; /*到左侧的距离,可自定义*/
             width: 5px !important;/*触发区宽度*/
             bottom: 0 !important;
             height: 100px !important;/*触发区高度*/
             padding:0 !important;
             margin:0 !important;    
             background:#F9F9F9 !important;
             z-index:99 !important;
             opacity: 1 !important;/*触发区透明度,1为不透明,0为透明,可设值:0~1之间*/
         }
         #anchor:hover,#quickpost:hover, #f_pst:hover, #f_post:hover{
             overflow:visible !important;
             width: auto !important;
             min-width:  75% !important;
             height: auto !important;
             opacity: 1 !important;
         }
     #f_pst .p_pop, #f_pst .p_opt{
         position: absolute !important;
         bottom: 0 !important;
         top: auto !important;
     }
 }
 
 @-moz-document domain("g.mozest.com") {
     #fastpostforecolor_menu.popupmenu_popup{
     position: absolute !important;
     top: 3.5em !important;
     left: auto !important;
     }
 }
如何修改“论坛悬浮回复框”才可以自定义触发图标那。谢谢
游客

返回顶部