WEB制作

IEとEdgeでCSSアニメーションにcalc()を使用すると動かないバグ

CSSアニメーションにcalc()を使用していたが、IE・Edgeで動かなかったので、備忘録として残しておきます。 calc()とは calcとは、css内で四則計算(足し算や引き算など)を行うことができる関数です。 対応状況 Opera Mini以外のモダンブラウザで対応しています。 calc()の主要なバグ 先ほど、Opera Mini以外のモダンブラウザに対応しているといいましたが、一部のブ […]

WPのPHP memory_limitは、デフォルト値は40Mらしい

とあるWP製サイトがPHPのメモリ不足でエラーを吐いていました。 PHP Fatal error: Out of memory (allocated ****) (tried to allocate **** bytes) php.iniで設定されている値よりもかなり少ないメモリでエラーを吐いてしまっているので、その原因を調べました。 WPのPHP memory_limitデフォルト値 調べた結果 […]

Gmail APIで JST 日本標準時 でクエリーを送る

Gmail APIでメール取得 Gmail APIでの受信メールの取得方法は、「Gmail APIでメールを取得する」を参考にしてください。 デフォルトのタイムゾーン 日本で、Web版Gmailなどを使用する場合、特に設定することなく、日本標準時刻になっていて、ページ上にある検索フォームでも日本標準時刻で検索することが可能になっています。 しかし、Gmail API を使用して、日付でメールの検索 […]

Gmail APIでメールを取得する

下準備 Google Developpers Consoleでプロジェクトを作成を行ってください。 メールの取得 メールの取得は一度、メール一覧を取得して、個別IDを取得します。その後、そのIDを用いて、メールの本文や件名を取得していきます。 [crayon-5b06551f3e13b045729624/] [crayon-5b06551f3e149546310854/] メールの絞り込み メール […]

preg_match(): invalid range in character class at offset 7

  • 2018.04.26

preg_match(): invalid range in character class at offset 7 PHP5.3からPHP5.6にアップデートにしたときに、正規表現の仕様書変更によって、よく起きるエラーのようです。 エラーの意味 エラーメッセージは、「正規表現で指定している範囲に文字は存在しません」といった感じの内容になっています。 エラーの原因 エラーの原因は、正規表現内に書か […]

CSSだけで画像をトリミングする

  • 2018.04.23

position: absolute; 要素からはみ出した部分を非表示にする方法 DEMO See the Pen mLVJzL by mizusawa (@webty_mizusawa) on CodePen. サンプルコード [crayon-5b06551f40c4b846365696/] [crayon-5b06551f40c67445482212/] object-fit: cover; […]

めんどくさい出社メールをJSでGmailを送信する

自社では、朝の出勤した時にタイムカードの代わりに空メールでの管理を行っています。 僕は、Webtyに入社して、1週間しか経っていませんが、もうすでに、朝、空メールを送信する作業がめんどくさくなってしまいましたw なので、ボタン一つで簡単にメールが送信できる自分用のページを作りたいと思います! 実装方法は、PHPだとsendmail.iniなどをいじるだけで簡単にGmailでメールが送信でちゃうので […]

CSSで文字の柄を一定間隔で変えていく方法

  • 2018.04.09

CSSで文字の柄を一定間隔で変えていく方法の紹介です。 ファーストビューに表示するサイトタイトルなどをこのように装飾してあげるとスタイリッシュな感じのサイトになるといいと思います。 デモ See the Pen XExZRE by mizusawa (@webty_mizusawa) on CodePen. サンプルコード [crayon-5b06551f432c2228174264/] [cra […]

JSで自分のHPにコナミコマンドを実装する

皆さんは、コナミコマンドを知っていますか? コナミ系のゲームなどで「↑↑↓↓←→←→BA」と入力すると自分のキャラがパワーアップしたり、特別なイベントが発生したりする隠しコマンドの代表的なものです。 コナミコマンドは『ギネス世界記録』に「もっともよく知られている隠しコマンド」として、登録されているぐらい有名な隠しコマンドです。 以前は、Twitterなどの有名なサイトにも実装されていました。 そん […]

CSSだけで画像に奥行きのある影を追加する方法

  • 2018.04.02

CSSで写真やイラストに影をつけて奥行きを表現する方法です。アニメやゲームなどのキャラクターの立ち絵などに使用するとキャラクターがより際立って見えると思います。 デモ 元画像 影付き画像 サンプルコード 影は filter: brightness(0%); を使って画像を真っ黒にすることで再現しています。 [crayon-5b06551f45e66468579848/] [crayon-5b065 […]