kobitoDevelopment

hoge.addEventListener("click", function () {
  navigator.clipboard.writeText("コピーさせたい文字列");
});

kobitoDevelopment

const iconCatch = document.querySelector("#icon-catch");
const center = iconCatch.querySelector(".center");
const icon = iconCatch.querySelector(".icon");

//関数宣言前に「async」を記述すると、その関数はPromiseを返す
const popCenterStar = async function () {
  // asyncの中にawaitを記述すると、asyncはawaitの結果が返ってくるまで実行を一時停止する
  await icon.animate([{ transform: `scale(1)` }, { transform: `scale(0.6)` }], {
    duration: 150,
  }).finished; // WebAnimationsApiでの.finishedは終了を検知させるためのPromiseを返す

kobitoDevelopment

//サーバー上にあるデータを取得するためのリクエストを実行
fetch("取得したいデータを保持しているURL")
  .then(function (response) {
    //fetch成功の場合
    console.log(response.json()); //JSON形式
    console.log(response.text()); //テキスト形式
    console.log(response.blob()); //型付きのバイナリデータ形式
    console.log(response.arrayBuffer()); //バイナリデータ形式
  })
  .catch((error) => {

kobitoDevelopment

//js処理用メディアクエリ
let mediaFlg;
let width;
function media() {
  width = window.innerWidth;
  if (width > 1024) {
    mediaFlg = "pc";
  } else if (width >= 600) {
    mediaFlg = "tablet";
  } else if (width <= 599) {

kobitoDevelopment

const circleWrap = document.querySelector(".circle-wrap");
const circleItem = document.querySelectorAll(".circle-item");
const circleItemLength = circleItem.length;
const spaceRatio = 1.4; // 要素同士の感覚比率
const deg = 360.0 / circleItemLength;
const red = (deg * Math.PI) / 180.0;
let xArray = [];
let maxDiameter;

window.addEventListener("load", function () {

kobitoDevelopment

function startCenterSlide(target) {
  const targetSlider = document.querySelector(target);
  //スライダーの初期配置を設定
  window.addEventListener("load", function () {
    const slideIndicator = targetSlider.querySelector(".slideshow-indicator");
    let indicatorHtml = "";
    let slideEach = targetSlider.querySelectorAll(".slide");
    slideEach.forEach(function (elem, index) {
      elem.style.left = 100 * index + "%";
      indicatorHtml += "<a href='#'>" + (index + 1) + "</a>";

kobitoDevelopment

const windowH = window.innerHeight;

window.addEventListener(
  "scroll",
  function () {
    if (document.querySelector(".hoge") != null) {
      const hoge = document.querySelectorAll(".hoge");
      hoge.forEach(function (elem, index) {
        const rect = elem.getBoundingClientRect();
        const scrollTop = window.pageYOffset || document.documentElement.scrollTop;

kobitoDevelopment

<p class="hoge">反転</p>
<div style="background-color:black; height:200px;"></div>
<div style="background-color:white; height:200px;"></div>
<div style="background-color:black; height:200px;"></div>
<div style="background-color:white; height:200px;"></div>

kobitoDevelopment

<!--padding -->
<div class="square">
  <div class="inner">
    <!-- 比率等倍ボックスに記述したい内容 -->
  </div>
</div>

<!-- aspect-ratio -->
<div class="hoge"></div>

kobitoDevelopment

//現在のページのURLを履歴に追加
history.pushState(null, null, location.href); // 引数は(state(オブジェクト),title(表示されないためnull),url)

//「戻る」を押す　をイベントトリガーに設定
window.addEventListener("popstate", function () {
  //戻るボタンを押した場合の処理を記述
  alert("ブラウザバックを使わないでください。");
});

/*