- CSS 背景画像をマスクして左右に動かす
- 縦長の四角形の中に横長の画像を入れ、左右にアニメーションさせるサンプルです。 横幅を狭いエリアに、横長の画像を配置すると全体に小さくするしかありません。 そんな時、サイズは大きなまま画像の全体を表示するために、アニメーショ...
- 2021-05-28 13:55:39
UIサンプルギャラリー「キプレ」
jQuery
close
MENU
用途
新着
履歴
分類
★
人気のあるUIサンプル
1
SVG 円の輪郭のアニメーション
2
CSS 左右に行き来するアニメーション
3
JS スマホを振って音を出す
4
SVG 円のサンプル
5
HTML5 ダウンロードボタン
6
jQuery 使ってしまいそうな非推奨のメソッド
7
JS メーラー起動
8
SVG 三角形のサンプル
9
laravel 配列のログ出力
10
NodeJS 画像をHTMLで表示する
11
CSS tableを使わないgridの表
12
SVG 矢印のサンプル
13
CSS 湯気の表現
14
JS 通信速度の検知
15
JS aタグを使わないリンクいろいろ
16
CSS インプットスライダーの加工
17
SVG 文字の輪郭のアニメーション
18
PHP CSVを読み込み先頭行の項目で連想配列
19
HTML Base64エンコードで画像を表示
20
jQuery Cookieで表示回数制限
11〜20
更新されたサンプル
-
JS HTMLの上書きと挿入投稿：2022-04-01
更新：2022-07-20![]()
-
jQuery ローカルでリンク集投稿：2022-06-12
更新：2022-07-20![]()
-
JS フルスクリーンの開始、解除投稿：2022-06-19
更新：2022-07-20![]()
-
GTM リファラでコンテンツを変える投稿：2022-07-03
更新：2022-07-20![]()
新着サンプル
- JS JSONのサンプル
- 記事のリストのデータのJSONのサンプル [[ { "post": [ { "id": 1, "title": "enjoy&qu...
- 2021-05-21 00:04:52
- PHP ライブラリを使ってQRコードを生成
- QRコードを生成するPHPをライブラリを使って実装するサンプルです。 活用したQRコード生成のライブラリはこちら https://github.com/endroid/qr-code...
- 2021-05-16 21:23:42
- PHP composer
- [[composer -v]] composerのバージョンを確認 [[composer self-update]] composer自体のアップデート [[composer self-update --rollback]] やっぱり...
- 2021-05-16 20:49:09
- PHP NewsAPIを取得する
- ニュースの情報を取得できるAPIを探していたところNewsAPIというサービスがあったのでPHPで取得してみた。 下記のサービス「NewsAPI」を使って最新のニュース情報を取得する手順の備忘録です。 NewsAPI なお、Node.jsやrubyやPythonでも取得が可能とのこと。...
- 2021-05-08 13:25:30
- JavaScript 別ページのOG情報を取得
- JSでHTMLページのOG情報を取得して、ページ内に表示するサンプルです。通信するページへはアクセス許可があるページに限ります。 同じサイト内で、別のページのOG情報を取得する時のサンプルです。 OG情報とはページをSNSでシェアするときなどに読み込まれるページの概要をまとめた情報で...
- 2021-05-05 18:45:28
- CSS インプットスライダーの加工
- スライドして入力するインターフェースのデザインやデータの取得するサンプルです。 HTMLのinputタグのtypeをrangeにすると、ブラウザのデフォルトのスライドUIが使えます。 ブラウザに依存するUIなので、そのまま使う方何かと安全ではあります...
- 2021-02-23 17:34:49
- CSS 背景が波打つボタン
- ボタンのエフェクトとして、文字の背景の色のついた部分が上下にアニメーションするサンプルです。 ボタンを押した時、何かがアクティブになる状態を表す一つの方法として、ちょっとしたアニメーションを使いたい時があります。 ボタンの背景にGifアニメを置...
- 2021-02-23 13:43:13
- JavaScript 音とアニメーションの連携
- 音が出るボタンを設置し、音に合わせて動きをつけるサンプルです。 このサンプルはjQueryとhowlerJSを使って、音がでるボタンを作り、音から抽出した音の長さを使って、CSSでアニメーションを実装しました。 howerJSというオー...
- 2021-01-31 23:53:53
- jQuery ライブラリを使って音をコントロールする
- howlerJSというライブラリを使って、ボタンを押したら音がなるだけのシンプルなサンプルです。 ボタンをjQueryで実装し、音の再生部分をライブラリを利用して実装します。 以下のボタンを押すと、mp3の音が再生されます。 自転車ベル...
- 2021-01-31 19:15:44
Top