マガジンのカバー画像

webデザイン メモ書き

10
運営しているクリエイター

記事一覧

スライダー作成

<div id="slick-slide" class="section-top__main-image"> <div><img src="assets/images/services/enamel_side_fix.jpg" alt="エナメル"></div> <div><img src="assets/images/services/skyblue_side_fix.j

もっとみる

jQuery ナビゲーション作成

<header class="header"> <div class="header-content-wrapper"> <h1>DHW Company</h1> <div id="open-button" class="open-button"><span></span></div> <nav> <div id="close-button" class="close-butt

もっとみる

ホームページ制作 【上に戻るボタン作成】

①フッター</footer>の下にこちらをぶち込む

</footer> フッターの下に<p id="scroll-top"><a href="#">^</a></p>  ←これをぶち込む

②次はcss に下記をぶち込む
#scroll -top { background-color: #eee ; opacity: 0.6; position: fixed; /*画面の位置の固定*/ bott

もっとみる

jQuery 問題2

問題
①button#hideをクリックしたらdiv#exを2秒で非表示
②button#showをクリックしたらdiv#exを2秒で表示
③button#showを何回クリックしたかdiv#exに文字列で数を表示
④button#showをクリックするたびにdiv#exの「border:〇px」の〇の箇所にクリックした数を入れていく
※クリック数で枠線が太くなっていく

↓これから追記していく

もっとみる

javascript 例文 コピペOK

<!doctype html><html><head><meta charset="utf-8"><title>jQuary イベント</title></head> <body> <button id="btn">クリック</button> <h1>ABC</h1> <script src="https://code.jquery.com/jquery-3.5.1.min.js" inte

もっとみる

jQuery 問題

問題文

①div#exの要素を作成(html)
②div#exの最初の表示時にフェードインから表示 ※4秒
③div#exを作成、文字列"<p>かきくけこ</p>"を挿入
④div#exの背景を黒、文字色を白に変更
⑤div#exの行頭に"<p>あいうえお</p>"を挿入
⑥div#exの行尾に"<p>さしすせそ</p>"を挿入

※難問
div#ex内の

もっとみる

jQueryの準備

jquery CDN

レンタルサーバーより反応が早い、メモリがのっかっている感じ?

①  jQueryを使うときはこれを使用する

ダウンロードが「minified」がいい。改行がないので、軽くて全部入り。

②  scriptの開始タグの前に入れる。

<body> <script src="https://code.jquery.com/jquery-3.5.1.min.js" int

もっとみる

jQueryの文法 学んだこと

セレクタ ⇒ メソッド ⇒ イベント

何に対して⇒ どのようなことを⇒ どのタイミングで



$("#email").on("click",function(){       $("emali").html("HTMLや文字列");});

​セレクタとメソッドが基本。

マウスオーバーやクリックしたタイミングで変えたいときは「イベント」で変える。

セレクタ

・CSSセレクタの互換の記述

もっとみる

jQueryのメソッド メモ書き

めちゃくちゃある。

$("セレクタ").メソッド(); ⇒メソッドに入れるものとは?

.html(elem); とか

<!doctype html><html><head><meta charset="utf-8"><title>メソッド</title></head><body> <h1 id="view"></h1><h2 class="view2"></h2> <script src

もっとみる