2018年4月

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-5b4e5ad691c21062290027/] [crayon-5b4e5ad691c26465130325/] object-fit: cover; […]

ユーザーは何を体験できるか?

貴方の商品やサービスで、ユーザー(お客様)は何を体験することができますか? ユーザーの本当の悩みや、真の願いを理解して、商品、サービスの提供や設計を行えていますか? お誕生日ケーキ 検索 例えば、自分が「お誕生日 ケーキ」と検索する場面を想像してみてください… その時、貴方は「お誕生日ケーキ」って何?どんなモノ?と思って検索しましたか? そう思って検索してないですよね。 「お誕生日ケーキを作ろう! […]

Markdownを書くのが楽しくなるAtomのPackage10選

Atomとは? GitHub製のIDEです。Atomを編集するならこのエディタが一番だと思います。 こちらから、無料でDLできます。 Packageのインストール方法 左上のある「file」-> 「setting」->「install」の順に移動し、自分がインストールしたいPackageを検索することでPackageをインストールすることができます。 japanese-menu Ato […]

めんどくさい出社メールを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-5b4e5ad6926f9233403410/] [cra […]

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

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

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

  • 2018.04.02

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