Home Made Garbage

Web

ホーム
電子工作
Raspberry Pi
IOT
WEB

JS でデバイス判定して viewport 設定

スマホでは width=device-width  を指定し、それ以外ではwidth=1200(最低表示させたいサイズ)を指定 [crayon-5f9b46b075f8a122729957/] コ...

HTML / CSS / JavaScript  2018.10.9 お母ちゃん

HTML と CSS だけでラジオボタンの画像選択 & 選択状態

font-awesome で アイコン選択にしてみた。 @media only screen and (max-width: 749px) { .cp_embed_wrapper ifra...

HTML / CSS / JavaScript  2018.10.3 お母ちゃん

レスポンシブサイトのスマホ表示で左右に動いてしまうときの対処法

はみ出しているコンテンツは何もないのに右側に謎の余白が出来て左右に動いてしまうときの対処法 [crayon-5f9b46b076573830504207/] ※ max-width: 749px ...

HTML / CSS / JavaScript  2018.9.30 お母ちゃん

動画背景の上に、動画の再生位置に合わせて画像・テキストを表示する

動画背景の再生位置に合わせて画像やテキスト表示する See the Pen QZwjzw by HomeMadeGarbage (@hmg) on CodePen.  timeupdate ,...

HTML / CSS / JavaScript  2018.9.29 お母ちゃん

RaspberryPi サーバ & WordPress ブログ を XSERVER に サーバ移転

先日の北海道地震の停電で、ラズパイ自宅サーバで運用しているこのブログも数日間ダウンしてしまいました。 「そのうちドメイン取得してレンタルサーバに移行しようか〜」とは考えていましたが、これを機に移行を...

Raspberry Pi / Web / WordPress  2018.9.26 お母ちゃん

セレクトボックスで表示切り替え

セレクトボックスで要素の表示をフェード切り替え See the Pen ZMKLJj by HomeMadeGarbage (@hmg) on CodePen. (adsbygoogl...

HTML / CSS / JavaScript  2018.9.5 お母ちゃん

横幅いっぱいmp4のレスポンシブ背景(キービジュアルなど)

video タグだと Chrome で動かなかったので video.js を使いました。 video.js Video.js: The Player Framework  CDNを利用...

HTML / CSS / JavaScript / Web  2018.8.21 お母ちゃん

WordPress のカスタムフィールドをグループ化して復数追加可能にする( Custom Field Suite プラグイン)

ショップサイトを作りました。 https://homemadegarbage.com/shop/ 作成するにあたって、記事に以下ののように情報を登録していきたいと思い、 調べてみたら Custo...

WordPress  2018.5.1 お母ちゃん

Nginx + uWSGI で「おもしろまじめなAIスピーカーアプリをつくろう」(秀和システム)のサンプルプログラムを動かす

先日お父ちゃんの依頼でサーバでPythonを動かせるようにしたのだけど、 https://homemadegarbage.com/nginx-uwsgi こちらの本のサンプルプログラムを動かそうと...

Web  2018.1.23 お母ちゃん

Raspberry Pi & Nginx サーバに uWSGI の追加

お父ちゃんから「サーバでPythonを動かしたい」との依頼があったので、 Raspberry Pi で運用中の Nginxサーバに uWSGIをインストールしました。 久々にupdate [c...

Raspberry Pi / Web  2018.1.22 お母ちゃん

固定ヘッダのアンカーズレ対応

1. [crayon-5f9b46b0771d5478190102/]   2. [crayon-5f9b46b0771d8458641465/] 1でうまくいかなかったページで、...

HTML / CSS / JavaScript  2017.12.4 お母ちゃん

canvas に 縦横いっぱい&センタリングで画像を貼り付け

background-size:cover; と同じように、 縦横比を保持 表示領域いっぱい 中央寄せ 表示 See the Pen canvasに画像貼り付け by Hom...

HTML / CSS / JavaScript  2017.11.16 お母ちゃん

PhoneGap を Android 実機でデバッグ

エミュレータ環境を作成したけど、エミュレータでも動作するのにやはりAndroid 実機では動かない…。 PhoneGap build からではなく、$ phonegap run android で試...

HTML / CSS / JavaScript / PC / スマホ / Web  2017.11.13 お母ちゃん

PhoneGap に Canvas2ImagePlugin インストール

メモ。 PhoneGap に Canvas2ImagePlugin をインストールしようとしたところ、 [crayon-5f9b46b0775de460973757/] のコマンドが [cra...

HTML / CSS / JavaScript / PC / スマホ  2017.11.12 お母ちゃん

動的追加要素の読み込み完了後にイベント追加

jQuery によって追加された iframe 読み込み完了後にイベントを登録したいけど、タイミングによってまちまちだったので下記の形で対応。 [crayon-5f9b46b07786b000939...

HTML / CSS / JavaScript / Web  2017.10.30 お母ちゃん

PHP で サーバ自身の IP のみ実行可能にする

簡易的に… とりあえずサーバ自身と同じIPアドレスである場合のみ許可する形。 もっと上手い形が他にあるとは思うんだけど、基本的に自宅使用なのでとりあえずは…。 サーバ自身のアドレスを取得 うち...

Web  2017.10.29 お母ちゃん

wordpress 投稿画面にカスタムボタン追加(プラグインなし): Nginx キャッシュ削除ボタン

キャッシュの削除をコマンドでやっていたけど、面倒なので wordpress の投稿画面に付けたいと思い立ち、勉強がてら自前でやってみました。 コマンド実行用PHP サーバの任意の場所にphpファイ...

HTML / CSS / JavaScript / Web / WordPress  2017.10.29 お母ちゃん

google アカウント名は変えずに YouTube チャンネル名だけ変更する

普段使いの gmail アカウントで動画をアップしていたので、アカウント名を替えたくなった。 まず、普段使いのアカウントなので google の名前は変更したくなくて、あくまで「チャンネル名だけの変...

Web  2017.10.28 お母ちゃん

innerText の 空判定が出来ない → textContent で取得する必要あり

こうゆう文を書いてて [crayon-5f9b46b077d20594752541/] innerText が空でも「空以外」で判定されてしまった。 .textContent で取得したらちゃん...

HTML / CSS / JavaScript / Web  2017.10.27 お母ちゃん

FileZilla で sftp が繋がらない – Connection timed out after 20 seconds of inactivity

FileZilla で鍵認証のSFTPが繋がらなくなった… [crayon-5f9b46b077ea8802777472/] 何故かあれこれしてもダメなので、先日の Git 接続の件を思い出し、 ...

Web  2017.10.25 お母ちゃん