Safari を起動すると何やらダイアログが出たのちすぐ消えて Safari が一切操作できない問題を解決する - Qiita
概要 タイトルだけ見るとなんのこっちゃという感じだが、以下のような状況に陥った。 Safari を起動する Safari が起動し、なにやら一瞬だけダイアログが出る が、すぐそのダイアログが消える その後 Safari を操作しようとするが何も操作できない（アドレスバーとかクリックできない） ダイアログに反応しようにもできないし、Safari も使えない。結構キツい。 環境 OS: macOS Mojave 10.14.4 Safari: 12.1 (14607.1.40.1.4) 外観モード: ダーク ※関係ないかもだけど一応 ダイアログの正体 自分の場合はこんなやつだった。クリックしようにもクリックできない。 普段使っているブラウザは Google Chrome なので、Safari にデータも残さないし、デフォルトブラウザも Google Chrome から変えないというふうにしたい
ハンバーガーメニューを表示する時、背景を固定する方法 - Qiita
やること あらゆるOSにおいて、スクロールがあるハンバーガーメニューを表示している間、背景のスクロールは動かないようにする。 まえおき 基本的に、スクロールさせるには overflow : scroll;、スクロールをしないようにするにはoverflow: hidden;を使うことが一般的。 アプリケーションのhtmlタグには初期値でoverflow : scroll;がついている。 そのため、わざわざoverflow : scroll;を当てなくてもスクロールできるようになっている。 ちなみに htmlタグにoverflow: hiddenをつけてみてください。ほとんどの場合、スクロールがを防げます。 このほとんどというのがどういうことか後ほどわかります。 実装前のCSSとJSのコード ハンバーガーメニューのCSS .humburger-menu { /*スクロールするようにする*/ o
MacOS high Sierraで`macOS could not be installed`と表示された。 - Qiita
MacOS high Sierraで`macOS could not be installed`と表示された。Mac環境構築初心者MacBookHighSierra 症状 macOSのHighSierraを使っており、アプリやらOSやらのアップデートが溜まっていたので、App Storeから実行した。 やけにアプリのアップデートに時間かかるなぁと思いつつ、アプリのアップデートはなんとか終了。 OSのアップデートに移り、再起動が必要ということで再起動した。 再起動し、ユーザにログインしようとすると画面には、 のような文字列とRestartボタンが。 ん？と思い焦りながら何度かRestartして見るも、同様の画面が表示される。 対処 ググって見ると同様のエラーが出ている方が結構いるようだった。 メニューバーからstartup diskを選択し、起動ディスクを選択、Restartした。 その結果
High sierraからmojaveまでのバージョンでCocoapodsがインストールできなかったのを解消 - Qiita
tl;dr mojave or lower sudo gem install cocoapods -n /usr/local/binしような。 たぶんmojaveでもおなじです。High sierraでインストールして、mojaveへアップグレードした場合はそのまま使えるようです。 Catalina or higher Catalina(macOS 10.15)では sudo gem install cocoapods でインストールができるようです。 概要 macOSX Highsierra上にて、sudo gem upgrade --systemして、sudo gem install cocoapodsでインストールしようとしたところ失敗したのでなんとかした。 詳細 $ sudo gem install cocoapods Fetching: concurrent-ruby-1.0.5
MacOS SierraでSassがインストール出来ない時の解決策 - Qiita
はじめに Sassのインストールをしようとすると下記エラーが出ました。 結構ハマる人多そうなので備忘録として残しておきます。 Sassとは これからはcssはSassで書こう。 $sudo gem install sass Building native extensions. This could take a while... ERROR: Error installing sass: ERROR: Failed to build gem native extension. current directory: /Library/Ruby/Gems/2.3.0/gems/ffi-1.9.23/ext/ffi_c /System/Library/Frameworks/Ruby.framework/Versions/2.3/usr/bin/ruby -r ./siteconf2018022
flexboxのバグに立ち向かう（flexboxバグまとめ） - Qiita
注）本文中の「コンテナ」「アイテム」について 本文中でいう「コンテナ」「アイテム」は、flexコンテナとflexアイテムのことを指しています。 コンテナ display: flexや、wrap指定などをする 複数のアイテムを含む アイテム flex: 1 0 0%などの指定をする 1. アイテム潰れる問題（Safari） Chrome Safari 潰れてますね。 起きる条件 Safari なぜ コンテンツの最小サイズを尊重してくれない模様 どうすればいいのか flex-shrinkに0を指定 flex-basisにautoを指定（デフォ値なので、指定がなければそのままでOK） Safari10にて修正済み（つまり、SierraとiOS 10以降では対応不要） 2. align-items:center はみ出す問題 Chrome IE11 はみ出てますね。 起きる条件 IE10-11 f
iPhone Xを購入せず、無料でウェブページの表示確認を行う方法 (macOS) - Qiita
今年10月に発売が予定されているiPhone Xは、その独特なディスプレイの為にセーフエリアを意識したウェブデザインが必須です。iPhone Xで意図せぬ表示にならないように実機の購入が必要だと考えるかもしれませんが、実はmacOSユーザーであれば、iPhone Xを購入せず無料でウェブページの表示確認を行えます。このエントリーでは、iPhone Xでの表示確認方法について紹介します。 ▲ iPhone Xでの表示確認をしている様子 iPhone Xで起こりうる意図せぬ表示 たとえば、画面最下部にコピーライトを固定表示しているサイトをよく見かけますが、iPhone XのSafariではメニューバーを表示する為のボタンで隠れる可能性があります。また、横持ちでコンテンツの左右が途切れてしまう可能性もあります。 ▲ 「iOS Human Interface Guidelines」より これらの表
.htaccessで本番サーバのtestディレクトリ以下でもルートパスを通す - Qiita
ハマったのでメモ 先日、クライアントの本番サーバ上にtestディレクトリを作ってその中にテストページをアップロードするよう依頼された。 （http://foo.com/test/○○～みたいな感じ） しかし、ソースを確認してみると、全てがルートパスで書かれたソースだった。 このままtestディレクトリ以下にアップロードしたところで当然読み込まれない。。。 手動でなおすこともかんがえたのだけれど、自分が書いたものではなかったので どこまで直していいのかわからないし、何より面倒だった。 そこで、何か方法がないか調べてみると、どうやら.htaccessでなんとかできるっぽいのでやってみた。 他にもっとスマートなやり方があればぜひ教えてください。 画像を読み込ませる
MAMP使い方・設定手順 覚書 - Qiita
仕事PCがMACに変わり、ローカルでの開発環境をスムーズに行えるようにMAMPの設定・プロジェクト設定のメモになります。 色々と参考記事に、自分の設定手順をまとめてみました。 MAMPのダウンロード MAMPのインストール バーチャルホストのカスタマイズ httpd.conf を設定 hosts を編集 MAMPの再起動 SSIを有効にする MAMPのダウンロード MAMPの公式サイトからダウンロードする MAMPのインストール公式サイト MAMPのインストール 無料で使いたい方は、MAMP FREEのDownloadをクリックしZIPを解凍してください。 解凍したファイルにdmgファイルをダブルクリックで実行 問題なければ、"Agree"をクリックします。 MAMPとMAMP PROというフォルダが作成されるので、アプリケーションフォルダへドラッグ MAMPの中にMAMP.appというフ
CSSのfont-sizeが%とかemとかremとかvwで指定されてると、ビビっちゃう君と僕を救う2分 - Qiita
CSSのfont-sizeが%とかemとかremとかvwで指定されてると、ビビっちゃう君と僕を救う2分HTMLCSSHTML5CSS3 ーーーーーーーーー 追記 2020年10/15 この歳になるとこういう記事のアプトプット怖いですね。。 とりあえず周り見てると、こうやってる人多いです html,body{ font-size:62.5%; } って書いてあげて そうすると 1.0rem が 10pxになるみたい。 そんで例えば24pxにしたい場合は2.4remって指定してあげるみたい。 以上。 ーーーーーーーーー いまだにレスポンシブ怖い、、、、。 なぜなら%とかemとかremのフォントサイズ指定があるから。。。 これらをなんとなくでしてる人。 途中で引き継いだ案件とかでpx以外が指定されててビビってしまった 僕とあなたへ捧げます。 😭 大前提 CSSのフォントサイズ指定方法は次の2つ
アニメーション最強のVelocity.jsの使い方 - Qiita
はじめに 今話題のVelocity.jsについて初歩の初歩だけまとめました。 ※追記：↓対抗馬のanime.jsについて記事書きました※ アニメーションライブラリ決定版か!?anime.jsで軽量・軽快に実装！ Velocity.jsとは jQueryのプラグイン。 $.animateと互換性を持ち、さらに高機能で非常に軽快なアニメーションをする。 アニメーション技術補足 jQuery Animation 便利だが重い。コマ落ちし過ぎ。 CSS Transition, CSS Animation 軽いが、アニメーションを繋ぐなどが出来なかったりなど使い勝手が悪い。 結局、JavaScriptを頼らないと使い物にならないことが多い。 Transit.js 有名なアニメーションライブラリのひとつであるjQueryプラグイン。 CSS Animationを制御しているため、軽快。 そして、3d-
[WordPress] 固定ページの子ページかどうか条件分岐させる方法 - Qiita
色んな条件分岐タグがあるWordPressですが子ページかどうか調べるis_subpage()のような条件分岐タグはありません。毎回調べるのでメモしておきます。 固定ページの子ページかどうか判定
![[WordPress] 固定ページの子ページかどうか条件分岐させる方法 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/743b4ae41326ccd85e34958408521f62fa0d2fb9/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9JTVCV29yZFByZXNzJTVEJTIwJUU1JTlCJUJBJUU1JUFFJTlBJUUzJTgzJTlBJUUzJTgzJUJDJUUzJTgyJUI4JUUzJTgxJUFFJUU1JUFEJTkwJUUzJTgzJTlBJUUzJTgzJUJDJUUzJTgyJUI4JUUzJTgxJThCJUUzJTgxJUE5JUUzJTgxJTg2JUUzJTgxJThCJUU2JTlEJUExJUU0JUJCJUI2JUU1JTg4JTg2JUU1JUIyJTkwJUUzJTgxJTk1JUUzJTgxJTlCJUUzJTgyJThCJUU2JTk2JUI5JUU2JUIzJTk1JnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LWNsaXA9ZWxsaXBzaXMmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1lZWU3YTI3YWNmNTc5MDFlZDgzMGM2ZTgxZmJiZDY3ZA%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwdGhhbmtzMm11c2ljJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz00MDE2MjRiNjBkNzVjZjI1OTNiMTBhYzU0NjYyOTA4MA%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D1b485adb791bc9b332c2b7310983a00a)
OS X を El Capitan にアップグレードしてしまい HHKB Lite2が利用できなくなったときの暫定的対処方法 - Qiita
HHKBのEl Capitan対応ドライバの提供時期は未定だそうです(2015/10/24時点) ※11月下旬公開予定になったようです(2015/11/11時点) ※対応ドライバが公開されました。下記の対処は不要となりました
前後のリンクのタイトルを文字数で丸める - Qiita
/* 前後リンクを生成（長いタイトルを丸める） ============================================= */ function Custom_previous_post_link($maxlen = -1, $format='« %link', $link='%title', $in_same_cat = false, $excluded_categories = '') { Custom_adjacent_post_link($maxlen, $format, $link, $in_same_cat, $excluded_categories, true, $maxlen); } function Custom_next_post_link($maxlen = -1, $format='%link »', $link='%tit
CSS3を使ったちょっと便利なテクニックシリーズ - Qiita
CSS3プロパティを使った、便利な実装テクニックを随時追加していきます。 1. 並んでいる要素の最後だけスタイルを適用しない ★対応ブラウザ → 確認 リストなどでマージンを調整する際、通常は:last-childで最後の要素のスタイルを上書きすると思いますが、:not()を使うことでもっとスマートに記述できます。
Firefoxのレスポンシブデザインビューのプリセット変更 - Qiita
ロケーションバーに about:config と入力し、Enterキーで起動 検索フォームに devtools.responsiveUI.presets と入力 devtools.responsiveUI.presetsを右クリックし、メニューから「値の変更」を選択（右クリックではなくダブルクリックでも可能） 表示された入力ウィンドウの内容を書き換えて「OK」とするとプリセット変更完了 以下が初期プリセットの内容（見やすいように改行を入れているが、実際には改行なしの1行） [ {"key":"768x1024","width":768,"height":1024}, {"key":"800x1280","width":800,"height":1280}, {"key":"980x1280","width":980,"height":1280}, {"key":"1280x600","wi
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
PHPソースの変更が反映されないときはOPcacheを疑え - Qiita