ブラウザ上に疑似Windows 98が実現された！

こちらのサイトでWindows 98のデザインを実現できるCSS(Cascading Style Sheets)「98.css」ファイルを公開しています。

更にGitHubの｢padraigfl/packard-belle-desktop｣では、この｢98.css｣を使ってブラウザ上で疑似Windows 98を実現しています。こちらにアクセスするとWindowsを電源投入時の立上げから始まります。立上げ以降の操作をしてみた映像をScreenToGifでキャプチャした所がこちら。

実用的なものではありませんが、遊んでみるには良いかも知れません。

GIFアニメの作成・編集｢ScreenToGif｣(8) 画像編集(2)

今回は前回までの状況を持つプロジェクトファイルを元に始め(こちら)、もう少し動画の効果を高めます。

先ず｢トランジション｣を入れますが、今回は「フェード」とします｡最初の花の紹介開始位置に入れます。(こちら)。

処置が終わった所がこちら。

他の(2ヶ所の)花の切替え時点でも入れます(2番目の花紹介の開始時点はこちら)。

最後に動画の進行を示すスライダーを設定します(こちら)。

完成したアニメGIFファイルがこちら。

この時点では3番目の花の紹介位置のズレは無くなっています(トランジションを入れるとズレ現象が無くなる？)。

Microsoft Edge 81(安定版)が公開 － ｢コレクション」の活用【改訂】

今回はMicrosoft Edge 81.0(安定版)で、「コレクション(Collections)」の管理機能を使ってみます。

Microsoft Edgeで「コレクション」の一覧を表示時している状態で、コレクションの1つに右クリックメニューにより(こちら)、全ての登録ページを(必要により別ウィンドウの)別々の新しいタブで表示する事ができます。

1つのコレクションの登録ページの一覧を表示している場合には、選択したページを開いているタブに表示できますし、右クリックメニューから(必要により別ウィンドウの)新しいタブに表示できます(こちら)。

またコレクション名の右にある｢･･･｣を選択すると、クリックしたメニューで｢すべて開く｣機能の他に、ページ一覧の情報を「コピー」する機能があります(こちら)。

「すべてコピー」ではクリップボードに以下の内容をセットします。

綺麗な銀河・星雲(1233)　－　はくちょう座(Cygnus)にある散開星団｢M29(NGC 6913)｣: 我家のＩＴ化
http://homenet.seesaa.net/article/474582308.html

綺麗な銀河・星雲(1177)　－　はくちょう座(Cygnus)にある惑星状星雲(Planetary nebula)｢NGC 7048｣: 我家のＩＴ化
http://homenet.seesaa.net/article/473412637.html

　　【途中略】

綺麗な銀河・星雲(921)　－　はくちょう座(Cygnus)にある原始星｢IRAS 20324 + 4057｣: 我家のＩＴ化
http://homenet.seesaa.net/article/464562455.html

ここでのメニューからはクリップボードにセットするのとほぼ同じ内容を Word や Excel に保存できます。ここまではデスクトップPCで操作しましたが、Officeソフトをインストールしている｢Surface GO｣で、別コレクション｢テスト｣を作り Excel に転送・保管する操作をしました。

保管した内容は「OneDrive」のフォルダ内に蓄積されました。それをデスクトップPC側のブラウザで内容表示した所がこちら。

「リンク」の列ではドメインだけの表示ですが、実際にクリックすると別タブに対応ページを開きます(こちら)。

ここで注意して欲しいのはコレクション一覧にコレクション｢テスト｣が追加されている事です。これは Microsoft Edge 間でコレクション情報の同期がなされている為です。

同期の設定は、｢設定｣→「プロファイル」→「同期」内にある「コレクション」をオンにする事で行われます(こちら)。

≪追記≫
コレクションに登録されたページから選択したページだけを｢コピー」する事もできます(こちら)。

【改訂】　2020年04月18日　18：15　追記

GIFアニメの作成・編集｢ScreenToGif｣(7) 画像編集(1)

今回は画像にテキストなどを挿入するなどの編集機能を使います。花に関する動きのあるアニメGIFの前にその花の説明をテキスト挿入の編集をします｡

先ず花の説明を入れる画像をロードします(こちら)。

メニュー｢画像編集｣で影を付けます(こちら)。

全ての画像に影を付けてから、「タイトルフレーム」を追加します(こちら)。

タイトルフレームでのテキスト属性及びその配置設定ができます。その結果がこちら。

次にロードした画像に位置付けて「キャプション」を指定します(こちら)。ここでもテキスト属性及びその配置設定ができます。

更に説明の「テキスト入力」を行い、テキスト属性及びその配置設定します(こちら)。

テキストのボックスはドラッグ操作で自由に移動できます。

最初のアニメGIFを挿入します(こちら)。

フレームサイズが原因不明で広がるので、マニュアルで中央に配置します(こちら)。

結果がこちら。

同様に2つ目・3つめのアニメGIFを挿入します。タイトルフレームや解説テキスト入りの画像フレームは各々1フレームなので、遅延時間を長く設定して表示が見えるようにします(こちら)。

結果がこちら。

全て適用してアニメGIFとして出力したのがこちら。

但し、残念ながら3つめの小片動画の配置に不具合があります(プロジェクトファイルへの書き出しは正常です・・・本件は問合わせ中)。

Microsoft Edge 81(安定版)が公開 － ｢コレクション」の管理

今回はMicrosoft Edge 81.0(安定版)で、「コレクション(Collections)」の管理機能を使ってみます。

「コレクション」アイコンからコレクションを開くと一覧を表示します(こちら)。

その1つで右クリックメニューで、コレクションの「編集」と「削除」ができます(こちら)。

コレクションの｢編集｣ではコレクションの名称を変更したり、コレクションエリア内の右クリックで「メモの追加」ができます(こちら)。

メモはコレクションや登録ページ(及び画像など)の説明に使えます(こちら)｡

ドラッグ&ドロップで位置の入替えもできます(こちら｡直ぐ上の画像と比較してください)。

コレクションに登録したページ(のカード)を選択すると、こちらの様に登録の解除ができます。

コレクションに登録したページ(のカード)に対する右クリックメニューにより(こちら)カードの編集ができます(こちら)。

コレクションに登録したページ(のカード)に対する右クリックメニュー(こちら)には、「コピー」と「リンクのコピー」があります。「リンクのコピー」は登録したページのURLをクリップボードにセットします｡「コピー」はページのタイトル＋URLです(例えば下記)。

綺麗な銀河・星雲(1134)　－　はくちょう座(Cygnus)の方向にある散光星雲｢網状星雲｣の一部｢NGC 6995(Bat Nebula)｣: 我家のＩＴ化
http://homenet.seesaa.net/article/472029312.html

次回はコレクションの活用です。

Microsoft Edge 81(安定版)が公開 － ｢コレクション」の作成

Microsoft Edge 81.0(安定版)が公開されました。こちらからダウンロードできますが、既に導入している場合は自動更新となります。

今回の目玉は「コレクション(Collections)機能」です。Operaブラウザの最新版の改善テーマ｢ワークスペース(Workspaces)｣と同様に、インターネットから取得した情報の蓄積・管理・利用に関わります。管理・利用の機能範囲からすると、Operaブラウザの機能を越えています。

右上のサービスアイコンとして「コレクション」が増えました。クリックすると右サイドバーで「新しいコレクションを開始する」事ができます(こちら)。

コレクション名を設定して、｢現在のページを追加｣でタブで表示中のページを保存します(こちらとこちら)。

コレクション内で複数のページを保存できます。

コレクションを一旦閉じて、サイド「コレクション」アイコンでこちらの様にコレクション一覧を表示します(未だ1つだけですが･･･)。

上掲のコレクションでは画像が中心なので、コレクションの中で画像を示して内容が分かり易いのですが、こちらの様にYouTube動画を含むページをまとめる場合には(現状は？)サポートできていません。

右クリックメニューからの登録も可能です。この場合は「新しいコレクションの作成」や登録先コレクションの選択ができます(こちら)。

動画や画像はコレクションフレームにドラッグ&ドロップで登録が可能です(こちら)。

次回はコレクションの管理機能などを使ってみます。

GIFアニメの作成・編集｢ScreenToGif｣(6) ボードでの描画を録画

｢ScreenToGif｣の最新版「2.23.1」が公開されましたので、今回からその最新版を使います(こちらを参照)。

今回は「ボードレコーダー」を使ってボードでの描画を録画します。目的はこちらとこちらのアニメGIFの小片動画を合併してそのタイトルをボードで示す事です。

ランチャーで「ボード」を選択します。

「ボード」の描画画面はこちら。サイズは合併編集する小片動画の800×600に合わしてあります｡

"ペン"の色は選択できます(こちら)。

｢●自動録画｣を押下した後、Ctrlキーを押下しながら描画している間録画しています。描画後に「■停止」として所がこちら。

アニメGIFファイルに出力したファイルがこちら。

原因は不明ですが、サイズ指定していても802×602で出力していました。

早速、サイズの際の問題になりましたが、ボードによる小片動画はそのままに、2つの追加小片動画の位置を1ドットづつずらして中央に配置しました(こちらを参照)。

2つの追加小片を合併したアニメGIFがこちら。

更に小片動画の切替え時に｢トランジション｣を掛けます。今回は「スライド」を使います(こちら)｡

[トランジション｣を2ヶ所に掛けて出来たアニメGIFがこちら。

Google Chrome 81でリンク先の特定文字に位置付け可能に

Google Chrome 81の安定版がリリースされました。目に見える新規の機能として、リンク先URLの後ろに「#:~:text="テキスト文字"」と指定すると、リンク先のページで最初に出てくる"テキスト文字"の位置に移動します。

実際、本記事をブラウザがChrome 81で見ている時に、下のURLをクリックしてください。

http://homenet.seesaa.net/article/474458979.html#:~:text=合併処理

多くのブラウザでURLに「#"テキスト文字"」とするURLフラグメントは実現しています。例えばこちら。

https://ja.wikipedia.org/wiki/地球#公転

今後「#:~:text="テキスト文字"」を使った良い例がでてくるでしょう。

Chromiumプロジェクトをベースにするブラウザは近々実現するかも知れません。

最新版「Firefox 75.0」でアドレス・バー周りが改善

こちらのmozillaリリースノートによると、最新版「Firefox 75.0」を公開しました。今回はアドレス・バー周りを改善しています。

第1が、アドレス・バーでのプルダウン表示がウィンドウ幅に合わせて最適に調整してくれます(こちらとこちらを参照)。

これは小画面PCの改善になるとしています。

第2がアドレス・バーのプルダウン表示でのサジェスト内容です。

何もアドレス・バーに入力していない状態でマウスクリックすると、「新しいいタブ」で指定している「トップサイト」をその順番で表示します(こちら)。

確かに、トップサイトのアイコンの順序を入れ替えると、(上の最初の画像と比べても)次のアドレスバー操作では変わっていました。

別ウィンドウのFirefoxページで開いているサイトがある場合、アドレス・バーのプルダウン表示に｢タブを表示｣でその旨を表示します(こちら)。勿論それをクリックすればそのウィンドウに移ります。

アドレスバーでの検索で、検索システムの様に検索候補を示してくれます(こちらやこちらを参照)。

検索候補は多数のユーザの検索統計によるというよりも、検索者自身のFirefoxでのこれまでの検索・表示実績に基づいているようです。

また入力の進行に合わせて検索候補も変えます(こちらからこちら)。

GIFアニメの作成・編集｢ScreenToGif｣(5) 動画ファイルの合併

今回は異なる2つのファイルの合併です。一般に短い小片動画をつなぎ合わせて1つのテーマとしてまとめる事をしますが、その最小単位の作業となります。

先ず、前回のアニメGIF「既定ファイル」(こちら)に加えて、新たにこれまで使ったアニメGIFの一部を抽出した｢追加ファイル」を用意します（こちら）。

さて、「既定ファイル」を読み込んだ所がこちら。

読み込んだ「既定ファイル」の最後に位置付けて、メニュー｢ファイル」の挿入グループにある「メディア」により、｢追加ファイル｣を読み込みます（こちら）。

挿入位置の確認として、今回は「後ろへ」を選択して合併処理を開始します（こちら）。

結果がこちら。

アニメGIFとして出力したファイルがこちら。

これまではデスクトップでのキャプチャ及びアニメGIFを対象にしましたが、動画提供サイト｢らぼわん (Lab01)｣などからのフリー動画をアニメGIFに変換できます。こちらの動画（.mp4）を幾つかの指定をした後（こちら）、アニメGIFにしたのがこちら。

また上記のような通常の動画を直接にアニメGIFへ合併できます(こちら）。

挿入位置の確認タイミングで前回にフレームサイズが異なる場合を見てきましたが、動画のサイズや位置はマウスで対象を選択して変更・移動できます（こちら）。

直接組込み処理をした（更に意味の余り無いフレームを削除した）アニメGIFファイルがこちら。