NewDownloadsPanel显示下载进度数值(Nightly)

阅读:6557回复:11
2012-08-17 00:22
写私信
楼主#
鼠标停留在下载按钮上显示当前下载进度数值,
仅适用于开启新下载面板的Firefox版本。
http://userstyles.org/styles/71325

图片:preview.gif


@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url(chrome://browser/content/browser.xul) {

#downloads-indicator-progress-area { position: relative }
#downloads-indicator-progress-area::after {
    left: 43px;
    content: "%";
    background: rgba(0,0,0,.5);
    padding : 0 2px 0 22px;
    margin-left: -22px;
    border-radius: 3px;
}
#downloads-indicator-progress::after {
    left: 22px;
    z-index: 1;
    content: attr(value);
    width: 20px;
    overflow: hidden;
}
:-moz-any(#downloads-indicator-progress,#downloads-indicator-progress-area)::after {
    position: absolute;
    top: 1px;
    font-size: 11px;
    color: #FFF;
    opacity: 0;
    transform: translateX(-20px);
    transition-duration: 800ms,600ms;
}
#downloads-indicator:hover :-moz-any(#downloads-indicator-progress,#downloads-indicator-progress-area)::after {
    opacity: 1;
    transform: translateX(0);
    transition-duration: 200ms,150ms;
    transition-property: opacity, transform;
    transition-timing-function: ease-out;
}
}

最新喜欢:

thescf...
iwo
2012-08-17 00:22
写私信
1楼#
支持楼主,试下去先;

再请教下,那个黑黑的下载图标,能改成白版的吗?
写成这样貌似不行:
#downloads-button,#downloads-indicator, #downloads-indicator-icon
{list-style-image: url("chrome://browser/skin/Toolbar-inverted.png") !important; }


Ps:还有,Fx 17a里(或者更早)已经可以根据文件后缀名,
尝试记住“另存为”的下载目录了吗,还是煋了?
罘罳無賴•飛蟲勿擾
2012-08-17 00:22
写私信
2楼#
lonely_8:...回到原帖

是用什麼主題?! 好像還蠻好看的...
Firefox 開啟安全模式,停用個人設定、佈景主題及擴充套件(無附加元件)測試:
說明 > 重新啟動但停用附加元件(Firefox 4+)
Firefox Profile: 說明 > 疑難排解資訊 > 開啟資料夾
排版引擎:Firefox(Gecko), Opera(Presto), Google Chrome(WebKit),
Safari(WebKit), Internet Explorer(Trident), Konqueror(KHTML)
2012-08-17 00:22
写私信
3楼#
iwo:支持楼主,试下去先;

再请教下,那个黑黑的下载图标,能改成白版的吗?
写成这样貌似不行:
#downloads-button,#downloads-indicator, #downloads-indicator-icon
{list-style-image: url("chrome://browser/skin/Toolbar-inverted.png") !important; }


Ps:还有,Fx 17a里(或者更早)已经可以根据文件后缀名,
尝试记住“另存为”的下载目录了吗,还是煋了?
回到原帖

新下载面板那个按钮是用背景做的。
#downloads-indicator-icon{
 background: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"),
                              0, 108, 18, 90) center no-repeat!important;
}

貌似是按文件后缀记住之前的下载路径了,这个功能我不常用,
我用紫云飞大大的save to脚本将常用下载路径设定好了。



是用什麼主題?! 好像還蠻好看的...[/quote]
FXChrome主题
2012-08-17 00:22
写私信
4楼#
相当好用,收了,多谢!
Firefox More than meets your experience
2012-08-17 00:22
写私信
5楼#
楼主用什么录你图片?感觉好清晰啊!我用的GGG录GIF,录出来感觉好粗糙的说。
iwo
2012-08-17 00:22
写私信
6楼#
lonely_8
FXChrome主题
回到原帖

那个下载图标css有效,不过同时把下载后变绿好像,还有楼主的进度条效果都干掉了,肿么恢复?
罘罳無賴•飛蟲勿擾
2012-08-17 00:22
写私信
7楼#
runking:楼主用什么录你图片?感觉好清晰啊!我用的GGG录GIF,录出来感觉好粗糙的说。回到原帖

Camtasia Studio

[quote="iwo"]那个下载图标css有效,不过同时把下载后变绿好像,还有楼主的进度条效果都干掉了,肿么恢复?[/quote]
我这里进度条效果正常。
试试这个吧
#downloads-indicator:not([counter]):not([attention]) #downloads-indicator-icon{
 background: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"),
                              0, 108, 18, 90) center no-repeat!important;
}
2012-08-17 00:22
写私信
8楼#

FXChrome主题

问下用了FxChrome+UX主题后,标签页与最上面有1px的距离

怎样消除这个1px呢?
http://pcxfirefox.wordpress.com/
2012-08-17 00:22
写私信
9楼#
pcxfirefox
问下用了FxChrome+UX主题后,标签页与最上面有1px的距离

怎样消除这个1px呢?
回到原帖

窗口最大化后的?数值自调吧
#main-window[sizemode="maximized"] #tabbrowser-tabs{
margin-top:-1px!important;
}
2012-08-17 00:22
写私信
10楼#

窗口最大化后的?数值自调吧
#main-window[sizemode="maximized"] #tabbrowser-tabs{
margin-top:-1px!important;
}

是最大化的,不过你这个写法不知道为什么和omnibar plus的动态效果有冲突

我直接写
#tabbrowser-tabs {
    margin-top:-1px!important;
    }

就行了
http://pcxfirefox.wordpress.com/
iwo
2012-08-17 00:22
写私信
11楼#
lonely_8
我这里进度条效果正常。
试试这个吧
#downloads-indicator:not([counter]):not([attention]) #downloads-indicator-icon{
 background: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"),
                              0, 108, 18, 90) center no-repeat!important;
}
回到原帖

OK!!!多谢!
PS:话说做UI的人为啥要这么干捏,记得那个后退按钮(backward button),也是用图片做背景,独独这里保留个奇葩,为嘛呢?
罘罳無賴•飛蟲勿擾