― MozillaZine.jp フォーラムは Mozilla 製品に関する情報交換の場です ―



All times are UTC + 9 hours

新しいトピックを投稿する トピックへ返信する  [ 8 件の記事 ] 
作成者 メッセージ
投稿記事Posted: 2022年12月06日(火) 13:22 
オフライン

登録日時: 2010年7月31日(土) 20:22
記事: 80
Ver107で次のCSSにてブックマークツールバーをマウスオーバーで自動開閉が正常動作しています。
#PersonalToolbar:not([customizing="true"]) {
transform: translateY(-500px);
transition: transform 0s ease 300ms !important;
position: absolute !important; z-index: 1;
display: block;
width: 100%;
}
#navigator-toolbox:hover > #PersonalToolbar:not([customizing="true"]) {
transform: translateY(0px);
transition: transform 0s !important;
}
そのままVer108で適用したいのですが、バーがトップに位置してアクティブタブが前面表示されます。
対応策、アドバイス願います。


添付ファイル:
コメント: Ver107のとき
アクティブタブは「Home」でブックマークツールバーは二段表示してます。

Art166.png
Art166.png [ 172.27 KiB | 表示数: 5706 回 ]
コメント: Ver108のとき
クティブタブは「Home」で前面表示され、ブックマークでツールが隠れてます。

Art162.png
Art162.png [ 195.88 KiB | 表示数: 5706 回 ]

_________________
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:107.0) Gecko/20100101 Firefox/107.0
通報する
ページトップ
 プロフィール  
引用付きで返信する  
投稿記事Posted: 2022年12月08日(木) 08:28 
オフライン

登録日時: 2014年2月22日(土) 00:59
記事: 4070
okb さんが書きました:
Ver107で次のCSSにてブックマークツールバーをマウスオーバーで自動開閉が正常動作しています。

ご提示の userChrome.css 内容ですが、
#PersonalToolbar(ブックマークツールバー)が、#titlebar、#nav-bar の下に配置されてることを前提に、
まずY座標-500した画面外の位置に display:block でレンダリングさせ、マウスオーバー時に元座標に移動させるという、少しトリッキーなことをやっているようです。

ベータ版のVer.108ですが、#PersonalToolbar に、「ブックマークツールバーの項目」の前に「ブックマークをインポートする」ボタンが追加されています。
これにより、綱渡り的な前提条件が崩れてしまい、
  • 表示位置が #navigator-toolbox 内のトップにリセットされる
  • 「ブックマークをインポートする」と「ブックマークツールバーの項目」が2段に表示
ということになっているようです。

あらかじめ「ブックマークをインポートする」をカスタマイズで取り除いておいて、表示位置シフト量を #navigator-toolbox の高さ分決め打ちで指定してはどうでしょうか。
きちんとやるにはスクリプトで行う必要があるように思います。

_________________
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:107.0) Gecko/20100101 Firefox/107.0


通報する
ページトップ
 プロフィール  
引用付きで返信する  
投稿記事Posted: 2022年12月08日(木) 10:42 
オフライン

登録日時: 2010年7月31日(土) 20:22
記事: 80
レス、ありがとう。
提示したCSSはググって取得したもので、私には知識はありません。

>#PersonalToolbar に、「ブックマークツールバーの項目」の前に「ブックマークをインポートする」ボタンが追加されています。

>ブックマークツールバーの項目」が2段に表示
CSSで多段表示してます。

今回提示したCSSは諦めます。
下記CSSは正常に動作するのですが、画面がズレるので好みではありません。
これを表示領域に上書き表示するようにできませんか?
/*ブックマークツールバーをマウスオーバーで開閉する*/
#PersonalToolbar:not(:hover) {
visibility: collapse !important;
background-color:transparent !important;
-moz-transition-duration: .5s !important;
-moztan-rsition-timing-function: ease-in-out !important;
}
#navigator-toolbox:hover > #PersonalToolbar {
visibility: visible !important;
-moz-transition: .5s ease-in-out;
}

_________________
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:107.0) Gecko/20100101 Firefox/107.0


通報する
ページトップ
 プロフィール  
引用付きで返信する  
投稿記事Posted: 2022年12月08日(木) 14:05 
オフライン

登録日時: 2014年2月22日(土) 00:59
記事: 4070
okb さんが書きました:

説明はしたつもりなのですが、話が噛み合っていないようです。
UIをいじる前に、新しいプロファイルで起動してVer.108本来の挙動を確認してみてください。

_________________
Mozilla/5.0 (Android 12; Mobile; rv:107.0) Gecko/107.0 Firefox/107.0


通報する
ページトップ
 プロフィール  
引用付きで返信する  
投稿記事Posted: 2022年12月08日(木) 15:02 
オフライン

登録日時: 2010年7月31日(土) 20:22
記事: 80
なぜ、噛み合わないのでしょう?
Ver107のサンプル画像のようにしたいということだけです。
サンプルのバーは2行表示してますが、1行表示と見てください。
新規プロファイルをつくる意味なんてありませんよ。

_________________
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:107.0) Gecko/20100101 Firefox/107.0


通報する
ページトップ
 プロフィール  
引用付きで返信する  
投稿記事Posted: 2022年12月08日(木) 16:54 
オフライン

登録日時: 2014年2月22日(土) 00:59
記事: 4070
ベータ版のVer.108ですが、#PersonalToolbar に、「ブックマークツールバーの項目」の前に「ブックマークをインポートする」ボタンが追加されています。

これが通じていない様子でしたので、ご自身で確認してくださいということです。
元の挙動を知らずしてのカスタマイズはありえません。

_________________
Mozilla/5.0 (Android 12; Mobile; rv:107.0) Gecko/107.0 Firefox/107.0


通報する
ページトップ
 プロフィール  
引用付きで返信する  
投稿記事Posted: 2022年12月08日(木) 18:36 
オフライン

登録日時: 2010年7月31日(土) 20:22
記事: 80
「ツールバーのカスタマイズ」のことだったんですね。
いずれにしろイレギュラーのことのようなので諦めます。

_________________
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:107.0) Gecko/20100101 Firefox/107.0


通報する
ページトップ
 プロフィール  
引用付きで返信する  
投稿記事Posted: 2022年12月22日(木) 09:11 
オフライン

登録日時: 2010年7月31日(土) 20:22
記事: 80
ロダにUPしてもらったものが動作しました。
#PersonalToolbar{
--uc-bm-height: 20px; /* Might need to adjust if the toolbar has other buttons */
--uc-bm-padding: 4px; /* Vertical padding to be applied to bookmarks */
--uc-autohide-toolbar-delay: 600ms; /* The toolbar is hidden after 0.6s */

/* 0deg = "show" ; 90deg = "hide" ; Set the following to control when bookmarks are shown */
--uc-autohide-toolbar-focus-rotation: 0deg; /* urlbar is focused */
--uc-autohide-toolbar-hover-rotation: 0deg; /* cursor is over the toolbar area */
}
:root[uidensity="compact"] #PersonalToolbar{ --uc-bm-padding: 1px }
:root[uidensity="touch"] #PersonalToolbar{ --uc-bm-padding: 7px }
#PersonalToolbar:not([customizing]){
position: relative;
margin-bottom: calc(0px - var(--uc-bm-height) - 2 * var(--uc-bm-padding));
transform: rotateX(90deg);
transform-origin: top;
transition: transform 60ms linear var(--uc-autohide-toolbar-delay) !important;
z-index: 1;
}
#PlacesToolbarItems > .bookmark-item{ padding-block: var(--uc-bm-padding) !important; }
#nav-bar:focus-within + #PersonalToolbar{
transition-delay: 100ms !important;
transform: rotateX(var(--uc-autohide-toolbar-focus-rotation,0));
}
#navigator-toolbox:hover > #PersonalToolbar{
transition-delay: 100ms !important;
transform: rotateX(var(--uc-autohide-toolbar-hover-rotation,0));
}
#navigator-toolbox:hover > #nav-bar:focus-within + #PersonalToolbar {
transform: rotateX(0);
}


下記部分は数値変更して利用
margin-bottom: calc(0px - var(--uc-bm-height) - 3.5 * var(--uc-bm-padding));

_________________
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:108.0) Gecko/20100101 Firefox/108.0


通報する
ページトップ
 プロフィール  
引用付きで返信する  
期間内表示:  ソート  
新しいトピックを投稿する トピックへ返信する  [ 8 件の記事 ] 

All times are UTC + 9 hours


オンラインデータ

このフォーラムを閲覧中のユーザー: なし & ゲスト[127人]


トピック投稿:  可
返信投稿:  可
記事編集: 不可
記事削除: 不可
ファイル添付: 不可

検索:
ページ移動:  
Powered by MozillaZine.jp® Forum Software © phpBB Group , Almsamim WYSIWYG
Japanese translation principally by ocean