最近よく見る、スマホのときに横スクロールをするメニュー。 作り方をメモしたいと思います！ 実装図・メリット カスタマイズ レスポンシブ（PC+スマホ） スマホ その他のカスタマイズ 色の変更 メニューの横幅・縦幅の変更 最後に 実装図・メリット イメージとしては、PCでは一般的なメニューになり、 画面の横幅が狭くなると、こんな感じで横スクロールをするようになるメニューです。 ちなみに、同じコードをはてなブログのスマホの方に入れると、こんな感じになります（動きは上と同じです）。 このメニューのメリットとしては、 トグルメニューのようにタップしなくても、はじめから数個のカテゴリが見えている Javascriptを使っていないので、回線が不安定なところでも比較的表示が崩れにくい はてなブログ以外でも使える 逆にデメリットは、 スクロールできるのか気付かれないかもしれない 狭い範囲での操作となるの

Web制作で一番の勉強は、多くのサイトを見ること。 有名サイトの使いやすく、そしてユーザーを楽しませるデザインやインタラクションのディテールをまとめているサイトを紹介します。

縦長ページのスクロール エフェクトで再スクロールや上にスクロールする時にも適用したい、高さ指定のない画像を読み込む時にスクロールバーががっくんがっくんするのを避けたい、美しいレイアウトを簡単に実装したい、そんな便利でちょっとずるいスクリプトを紹介します。 ScrollTrigger ScrollTriggerの使い方 Scrollbear Scrollbearの使い方 Barba.js Barba.jsの使い方 Isometric Grids Isometric Gridsの使い方 Multiple.js Multiple.jsの使い方 anime.js anime.jsの使い方 ScrollTrigger ユーザーがスクロールすると、要素にアニメーションが適用されるスクリプトはいくつかありますが、その多くは一度アニメーションが適用されると再び適用されません。下にスクロールしてアニメーショ

昔のWindows知っていると逆につらい： Windows10の「超ショートカット文化」に慣れるとかなり使いやすい。Macより作業速度は早いと思う。ただし、従来のWindowsの使い方を世襲するとつらい。オッサンは昔の使い方を早く捨てろ。慣れろ。 スタートボタンは復活したが使えない： Windows10でスタートボタンが復活したがクソなので使わない。MS社内の権力闘争の匂いしかしない。代わりにWindows10からWin+SとWin+Xのショートカットを使う機会が異常に増えた。ないと死ぬ。 アプリ起動の基本はWin+S ランチャーはWindowsキー+Sを押して、使用するアプリの頭文字を1-3文字打てば良い。スタートメニューが復活したがゴミクズだ。コルタナはランチャーとしてはSpotlightより動作が早い。インデックス検索はMacのほうが賢いが、ランチャーとしてはコルタナの方が賢い。Wi

あぁ、また三日坊主で終わってしまった・・・と嘆いてませんか？私なんか、そんなのしょっちゅうでしたよ。今度こそは！と意気込んでみても、3日も経たないうちに挫折して続かないこと、たくさんありました。 私って根性ないよなーとか、根気がないよなーって、自己嫌悪に陥ってました。でも、最近は違います。挫折しない方法を考えてみたら、意外に簡単に三日坊主を克服できました。 というわけで今回は、挫折しない行動パターンを心理学的に考えてみた結果をお話ししますね。 根気がないから挫折するのではない 三日坊主で終わると、ほとんどの人が「自分ってやっぱ根気がない奴。」なんて責めるだけで終わってしまうのでしょう。でも、根気がないから挫折して三日坊主で終わるのではないのです。挫折した時に「根気がない」と思い込むのをやめましょう。 根気がない自分だと思い込むと、根気がないから目標を立てないという悪循環にはまっていきます。

ちゃま @tya_maa @ryu8103 @ridvan_mirei このあともシフト入れないならこのすき家には必要ないとか辞めたら？とか辞職を促す発言むちゃくちゃ言われましたw 2016-07-14 08:48:37

ソフトバンクの「アメリカ放題」はこれまで申し込み不要で無料でしたが、これはキャンペーンで6月30日に終了。7月1日からは、新たに申し込む必要があります。テータ定額パック標準（5G）以上の人は自動更新もあるようですが、それ以下の場合は7月1日から接続料がかかります。キャンペーン終了に気付かずに使用していると、高額の通信料を請求されることになります。 （追記） 世論が動いた結果、7月以降もキャンペーン継続となりました。7月1日から再開までの間の接続料金もキャンペーン適用となるようです。最後のほうに付け足しておきました。ちゃんちゃん。

応募企業の探し方や履歴書の書き方、面接のポイントから円満退職の 秘けつまで。あなたの転職を成功に導くためのノウハウを紹介！ 《この記事で扱う関数・ショートカット》 一つのセルから、ある条件を満たす文字列を抽出する：IF関数・MID関数・LEFT関数 一つのセルの途中から文字列を抽出する：MID関数・LEN関数 異なるセルの文字列を結合する：CONCATENATE関数 不要な列を削除する：値貼り付けのショートカット 文字列操作関数の活用【1】　文字を検索してデータを抽出する：FIND関数・LEFT関数 文字列操作関数の活用【2】　アルファベットを大文字・小文字に統一する、頭文字のみ大文字に変換する：UPPER関数・LOWER関数・PROPER関数 文字列操作関数の活用【3】　文字数を指定して削除する：REPLACE関数 文字列操作関数の活用【4】　文字をまとめて置換する：SUBSTITUTE

カルボナーラを自分でおいしく作るのは、ハードルが高いというイメージがありませんか？ そもそも「そのとき家にある材料」で作れないのが難点ですよね。生クリームを冷蔵庫に常備している男性は、控え目に言ってもかなり少数派でしょう。 牛乳で作るカルボナーラのレシピもいろいろありますが、やっぱり濃厚さに欠けます。生クリームも牛乳も使わない本場イタリアのようなカルボナーラでもいいのですが、日本の生クリーム入りのカルボナーラに舌が慣れているせいか、個人的には日本式のほうが好みです。 ▲市販のレトルトソースのカルボナーラ 1人前200円台で、多くのお店で売られているレトルトソースです。味はカルボナーラだけど、どこか味気ない。ベーコン少ないし、どんなパスタソースでも「レトルト」の味がします。 だからやはり自分で作ってみようではありませんか、カルボナーラ。 実は拍子抜けするほど簡単に作れるレシピだったのです。

Supership株式会社取締役でnanapi創業者 古川健介氏と、コネヒト代表大湯との対談後編です。0から起業をし、事業をつくり上げた二人が、これからのメディアとコミュニティの未来を考えます。（前半はこちら） 最近のメディアに求められていることとは古川：Connehito社では、メディアを始めてから、2年くらいたちますよね。この2年間で、最近変わったなーと思うことはありますか？ 大湯：以前から断続的に感じていたことですが、今は個人が誰でもメディアになれる時代です。メディアって言わなくてもメディア業やってる感じ。そのなかで大きなプラットフォームになるものはなんだろう、と今一度考えることが増えました。 Twitterでつぶやくのもひとつのメディアです。じゃあその中で、ビジネス的な意味で優劣がつくポイントってなんだろうと考えています。 アプリに合わせて進化するユーザー古川：なるほど。では、最近

:target疑似クラスは、ターゲットとなるアンカーリンク先の要素を表します。例えば、長い記事をユニークなidでセクションに分け、それぞれのセクションにアンカーリンクを設置します。:target疑似クラスを利用すると、ターゲットとなるセクションごとにスタイルを適用することができます。 :target疑似クラスを使ったスタイルシートのテクニックと注意点を紹介します。 The :target Trick :target以外の便利な疑似クラス・疑似要素については、下記のページを参考に。 使い方をしっかりマスターしておきたい便利な5つの疑似クラスと疑似要素 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 :target疑似クラスを使って、コンテンツを表示・非表示 :target疑似クラスを使って、ナビゲーションをスライドアウト :target

DELL vostro15 3000のファンクションキーについて 最近このパソコンを使い始めたのですが、以前使っていたパソコンのように F6でひらがな、F7でカタカナに変換できません DELL vostro15 3000のファンクションキーについて 最近このパソコンを使い始めたのですが、以前使っていたパソコンのように F6でひらがな、F7でカタカナに変換できません BIOSをいじると設定を変更できるようですが、詳しい方法がわかりません ご存知の方がいましたら、ご教示願います ちなみにWindows 8.1です

はじめまして、らくからちゃです。 はてなブログで、お金や世の中のデータを調べた結果を自分なりにまとめてみた「ゆとりずむ」というブログを書かせて頂いております。 最近、わたしは妻と那須へ遊びに行き、楽しい休日を過ごしました……。が、クレジットカードの利用明細を見て震えております。((((；ﾟДﾟ))))ｶﾞｸｶﾞｸﾌﾞﾙﾌﾞﾙ 乏しい口座残高を見るたびに、「バブルの頃は凄かったぞ～」という話を思い出します。 バブルっていいなぁ ギラギラに輝くネオン街の合間を、海外で買いあさった高級ブランド品を身につけたおねぇちゃんが闊歩し、おじさんたちはタクシーを呼び止めるために1万円札をひらひらさせ、海外旅行ガンガン行き、現地のブランド品を買いあさる。バブルの頃は、とにかくすべてがすごかった。そんな話をよく耳にします。 でも本当にそんなことがありえるのだろうか？ 実際はどうだったのだろう？ いろいろと気に

リンク切れやアドレスの打ち間違いなどでユーザーが迷い込んでしまうページ、それが通称「404 NOT FOUND」のエラーページです。ページが消されていたり、そもそも存在しないページにアクセスされてしまっていたりなど、状況はさまざまですが、一つ言えるのは、ユーザーにとっては決して良い体験ではないということです。 ですが、そういったユーザーの状況を見越して、海外のサービスなどではちょっとした仕掛けを施したり、ウィットに富んだグラフィックや文言を用意したりと、エラーページだからこそ、凝った工夫でユーザーを楽しませようとするサイトもあります。 今回はユーザーのエラーによるネガティブな体験を帳消しにしてくれるようなクリエイティブなエラーページをご紹介します。 Slack https://slack.com/hellomynameismilkman コミュニケーションアプリSlackのエラーページは美

1分でわかるフローレンス こども達のために、日本を変える。フローレンスは日本の子ども・子育て領域に関わる課題解決と価値創造に取り組む、国内最大規模の認定NPO法人です。 日本初の訪問型病児保育事業で2004年に設立し、子どもの虐待、子どもの貧困、障害児家庭の支援不足、親子の孤立の課題を解決するため、多様な保育事業を運営するほか、全国で「こども宅食」「おやこよりそいチャット」「にんしん相談」「赤ちゃん縁組」などの福祉事業と支援活動、政策提言をおこなっています。

2016年7月7日(木)に全面リニューアルし、5パターンのデザインを楽しめるようになったカヤックのコーポレートサイト！その裏側ではどんな工夫があったのでしょうか？ なぜデザインガイドラインを作るのか？ 今回のリニューアルは、ただでさえ大規模なカヤックサイトを、5倍デザインするという、果てしない規模の開発になりました。これを真っ当にページごとにデザインしていては、修正・変更があるたびに作業量は5倍になり、いくら時間があっても足りません。 そこで、デザインチームでは効率的に作業を進めるために「デザインガイドライン」を制作しました。5つのデザインごとに、文字やボタン、UIパーツをまとめたファイルを作ることで、修正の量を最小限に抑え、同時にエンジニアへの修正指示もかんたんにできるようになりました。ここでは、そのガイドラインの一部をご紹介します！ ナビゲーション ガイドライン メニューやフッターなど