技術的なあれこれメモ

Blogger, チラシの裏, 備忘録

個人的なメモ。すぐ忘れるから。

ffmpeg

wavの音量を確認して音量を調整する

ファイルの音量確認

ffmpeg -i 005_ずんだもん（ノーマル）_あれあれ？どうして….wav -vn -af volumedetect -f null –

ファイルの音量を変更してコピーを作って保存

ffmpeg -i 005_ずんだもん（ノーマル）_あれあれ？どうして….wav -codec:v copy -af volume=6.1dB 005_ずんだもん（ノーマル）_あれあれ？どうして_6.1dBup.wav

AV1エンコードの動画 input_av1.mp4 を、グラボを使って、h264に変換、プリセットslowでCQ15。コピーとしてファイル名 output_h264.mp4 として出力。

ffmpeg -i input_av1.mp4 -c:v h264_nvenc -preset slow -cq 15 -c:a copy output_h264.mp4

HTMLでネタばれとかを折りたたむやつ

（2023-06-23追記）

っていうか <details> <summary>をつかって以下のように書けば実現できると！

<details class=”accordion_cat”>
<summary>参考URL（押すと開く）</summary>
<div class=”ribbon15-wrapper”><span class=”ribbon15 material-icons”>pets</span>
    <div>
    —
    リンクをだしたりね。<br>
    <a href=”https://www.webcreatorbox.com/tech/details-summary”>https://www.webcreatorbox.com/tech/details-summary</a>
    —
    </div>
</div>
</details>

なんてこった。

参考URL（押すと開く）
pets
リンクをだしたりね。

（//2023-06-23追記ここまで）

ここを押すと開く（１）
pets
隠す文字ここ（１）
メッセージを書くよ。
もにゃもにゃ
ほにゃーん。

以下、ソース。

HTML

<div class=“openCloseButton” name=“box1”>ここを押すと開く（１）</div>
<div class=“ribbon15-wrapper openCloseBox”><span class=“ribbon15 material-icons”>pets</span>
    <div>
—
        隠す文字ここ（１）<br>
        メッセージを書くよ。<br>
        もにゃもにゃ<br>
        ほにゃーん。
—
    </div>
</div>

スタイルシート

スタイルシートのリボンはサルワカさんの。
<style>
.ribbon15-wrapper {  
    position: relative;
    margin: 15px auto;
    padding: 10px 55px 10px 30px;
    width: 95%;
    background: #f1f1f1;
    box-sizing: border-box;
}

.ribbon15 {  
  display: inline-block;
  position: absolute;
  top: -6px;
  right: 10px;
  margin: 0;
  padding: 10px 0;
  z-index: 2;
  width: 40px;
  text-align: center;
  color: white;
  font-size: 17px;
  background: linear-gradient(#ff785b 0%, #e95738 100%);
  border-radius: 2px 0 0 0;
}

.ribbon15:before {
  position: absolute;
  content: ”;
  top: 0;
  right: -6px;
  border: none;
  border-bottom: solid 6px #cf4a2d;
  border-right: solid 6px transparent;
}

.ribbon15:after {
  content: ”;
  position: absolute;
  left: 0;
  top: 100%;
  height: 0;
  width: 0;
  border-left: 20px solid #e95738;
  border-right: 20px solid #e95738;
  border-bottom: 10px solid transparent;
}
.openCloseButton{
    /*開閉ボタン機能用*/
    cursor: pointer;
    /*ボタンデザイン用*/
    display: inline-flex;
    cursor: pointer;
    left: 20px;
    position: relative;
    background: #ffd98a;
    padding: 2px 5px 2px 25px;
    font-size: 20px;
    color: #474747;
    border-radius: 0 10px 10px 0;
    align-items: center;
}
.openCloseButton::before {
    /*開閉ボタン機能用*/
    transition: .4s;
    transform: rotate(0deg);

    /*ボタンデザイン用*/
    font-family: “Material Icons”;
    content: ‘e91d‘;
    display: inline-block;
    line-height: 40px;
    position: absolute;
    padding: 0em;
    color: white;
    background: #ffa337;
    font-weight: 900;
    width: 40px;
    text-align: center;
    height: 40px;
    line-height: 40px;
    left: -1.35em;
    border: solid 3px white;
    border-radius: 50%;
}
.openCloseButton.is-active::before {
    transform: rotate(30deg);
}

.openCloseBox {
    color:#ffffff00;
    height: 0;
    opacity: 0;
    visibility: hidden;
    transition: .8s;
}
.openCloseBox.is-open {
    color:#363636;
    height: auto;
    opacity: 1;
    visibility: visible;
}
</style>

JavaScript

<script>
document.addEventListener(‘DOMContentLoaded’,() => {
  const title = document.querySelectorAll(‘.openCloseButton’);
 
  for (let i = 0; i < title.length; i++){
    let titleEach = title[i];
    let content = titleEach.nextElementSibling;
    titleEach.addEventListener(‘click’, () => {
      titleEach.classList.toggle(‘is-active’);
      content.classList.toggle(‘is-open’);
    });
  }
});
</script>
Blueskyでシェア