SVGをcss/jsで操作するときに知っておきたいこと - Qiita
はじめに ※SVG初心者向きの記事です SVGはスケーラブルでベクターなグラフィックスです。レスポンシブや高解像度ディスプレイに対応する時にはとても頼もしい存在です。htmlと同じようにcssやjsでの制御も可能なため、インタラクティブなコンテンツもお手の物です。 そんなSVGは表示だけであれば簡単ですが、cssやjsを利用する際には知っておきたい基本知識があります。 これ以上、私のように時間を浪費してしまう哀れな子鳥たちを増やさぬようメモしたいと思います。ｱｰﾒﾝ 目次 表示のさせかたに気をつけろ！ cssに気をつけろ！ fill: none;に気をつけろ！ viewBoxに気をつけろ！ jQueryに気をつけろ！ サーバーの設定に気をつけろ！ 表示のさせかたに気をつけろ！ SVGの表示方法は複数あります。 <img>のsrcでファイルを読み込む background-imageプロパテ
VERMONT Holding | Exkluzivní módní značky a zážitek z nakupování
Tento web používá k poskytování služeb, personalizaci reklam a analýze návštěvnosti soubory cookie. Používáním tohoto webu s tím souhlasíte.
Navigating Responsibly
Almost everything that surrounds us has been on board a ship. Your phone, your tablet and probably your table. Your refrigerator and the rest of your kitchen. And the building materials for your house. Many things you eat and most of what you wear. The petrol for your car and the gas used for producing your electricity and your heating. Efficient transportation leads to cheaper goods for consumers
S5-Style
宇都宮勝晃、尾花大輔、菅野友香、久野遥子、中村勇吾がウェブデザインに寄せる思いとは？発想の源も いまやウェブサイトは、私たちの暮らしに欠かせない存在になっています。インターネットの広大な海には無数のサイトが存在し、それらは、ウェブデザイナーやフォトグラファー、イラストレーターたちの手によって構築されています。そういったクリエイターたちの活動を俯瞰し、20年にわたってキュレーションしてきた「S5-Style」。ウェブデザイナーの田渕将吾さんが自身の学習の一貫として始めたそのサイトは、「すべてのクリエイティブに光を当てること」をコンセプトにリニューアルオープンしました。田渕さんは、素晴らしいデザインの集約はもちろん、それらをつくりだすデザイナーやクリエイターが交流できる場を生み出し、デザインの未来に貢献したいと語ります。さまざまなかたちでウェブサイトに携わるクリエイターたちは、何をインスピレー
maxlengthを使ってはいけない。特にパスワード入力欄で使っちゃ駄目！ - Qiita
今日自分が体験したトラブル事例に、ユーザビリティ向上のための気づきがあったのでメモしておきます。 ※本文よりまず、このコメント、こっちに言いたいことが集約されてるのでまずはこっちを読むと早いです。 ※本文よりまず、このコメント、こっちに言いたいことが集約されてるのでまずはこっちを読むと早いです。 ※本文よりまず、このコメント、こっちに言いたいことが集約されてるのでまずはこっちを読むと早いです。 事例：登録時のパスワードでログイン出来ない！？ 今日、とあるWEBサイトでユーザ登録を行った際に、登録時に入力したパスワードでログイン出来ないというトラブルがありました。 普通は自分の入力ミスを疑うところですが、登録もログインもコピペで入力しているので入力ミスはありえ無いと思っていました。 お問い合わせフォームからバグ報告 というわけでこれはバグだろうと、お問い合せフォームから以下のような内容の報告
全てのWindowsユーザを幸せにするツールたち - Qiita
僕個人がWindowsマシンにインストールしていて、 これが無くなったら困るなあ・・・という、 そこに当たり前に存在する幸せ（ツール）を紹介します。 プログラマでなくても幸せになれるツールを選びたかったので、 敢えてプログラマ向けとせず「全てのWindowsユーザ」としております。 Clover Chrome風のエクスプローラーです。 標準のエクスプローラーはフォルダごとにウィンドウが表示されるので、 気づいたらいくつもウィンドウが無数に増えて、 今見たいフォルダがどこにあるかわからなくなることが多々あります。 Cloverを使えば、タブで管理されるのでウィンドウは１つ（任意で増やせます）、 目当てのフォルダもすぐに見つかってイライラから解消されます。 さらに、Chromeのショートカットも使えるため、 例えば、一度消してしまったタブをShift+Ctrl+Tで復活、なんてこともできます。
target="_blank" のセキュリティリスク(デモ動画あり)
HTMLを勉強する際に最初に覚えるものの1つにa要素(タグ)があります。HTMLのアイデンティティと言っても過言ではない、ハイパーリンクを実現する大事な要素です。 href属性に設定されたリンク先のURLをどのウィンドウ等に表示するかを決めるtarget属性というものがあります。任意の値を設定してウィンドウに名前を付ける事で、複数のa要素から同じウィンドウへリンク先URLを表示する事もできますし、常に新しいウィンドウを開く_blankのような、あらかじめ挙動が設定されている値もあります。 target="_blank" のセキュリティリスク リンクの開き方を決定するtarget要素ですが、この挙動を利用してリンク先からリンク元のウィンドウを操作できるというセキュリティリスクが公開されています。 Target="_blank" - the most underestimated vulner
SVGのアニメーション手段とその選び方 - Qiita
SVGアニメーションの手段 HTMLに組み込んだSVGをアニメーションさせる方法は以下の3つ。 CSS JavaScript HTML - SVG element 結論から言うとCSSかJavaScriptのどっちかを使うべき。 CSSでアニメーションできる範囲ならCSS、それ以上したいならJS。ブラウザ対応は考慮してない。 CSS CSSからSVGの各プロパティの値を変更する。さわれる属性は限られているがシンプルに実装しやすい。 制御範囲はSVGのプレゼンテーション属性と呼ばれる属性に限られる。(プレゼンテーション属性一覧: https://www.w3.org/TR/SVG/propidx.html) 正直一覧を見てもピンとこないので以下に例を示す。 できることの例 SVGの線や塗りのRGBAを変更する 線の幅やスタイル(破線とか点線とか)を変える シェイプが筆跡に沿って徐々に現れる的
913 NEUF UN TROIS
国産の厳選した素材を使い、アトリエでひとつひとつ丁寧に心を込めてお作りしています。ご指定日がない場合、最短納期でお届けいたしますが、お届けまで多少お時間を要する場合もございます。予めご了承ください。 2023/03/15 厳しい寒さも終わりを迎え、だんだんと暖かい日が増えてきましたね。 来週より短期催事出店いたします。 きっと桜も見頃だと思います。お花見のお手土産にいかがでしょうか。 皆様のご来店を心よりお待ちしております！ 《開催期間》 2023年3月23日(木)〜3月29日(水) 《営業時間》 11:00〜21:00 《開催場所》 渋谷ヒカリエShinQs 地下２階 フードステージ 《アクセス》 JR・京王井の頭線「渋谷駅」と２階連絡通路で直結 東京メトロ銀座線「渋谷駅」と１階で直結 東急東横線・田園都市線・東京メトロ半蔵門線・副都心線「渋谷駅」B5出口と直結 2022/12/01 週
[PHP] 三項演算子の書き方などについて
PHPの調べ物をしていたら見慣れないif文の書き方に遭遇しました。三項演算子というものだったのですが、忘れそうなので書き方や注意点についてメモです。 PHP: 比較演算子 – Manual 書き方と例 基本的な書き方 [条件] ? [条件に当てはまる時の値] : [当てはまらない時の値] 書き方の例 例1）$a の 値が5より小さい場合は $data にtrue。それ以外は false を入れる。 $data = ($a > 5) ? true : false ; 例2）$a の値が5の時に $a に1を足す。それ以外はそのまま。その値を $data へ入れる。 $data = ($a == 5) ? ++$a : $a ; 注意点 if文の省略系の書き方と思ったのですが、結果を返すのみで処理をするわけではないので演算子という形のようです。 if..elseの構文ににていますが、if文とは
![[PHP] 三項演算子の書き方などについて](https://cdn-ak-scissors.b.st-hatena.com/image/square/f088b36dd56b0cef4168f5bc4495909044f687ba/height=288;version=1;width=512/https%3A%2F%2Fmemocarilog.info%2Fwp-content%2Fuploads%2F2013%2F06%2Ficon1.png)
【PHP】特定の文字列を含むかのチェック - Qiita
正規表現を使わない場合 strpos,strstr,preg_matchではstrposが最も早いのでstrposを使う。 PHPマニュアルにもそのように書いてある。 strstr もし特定の haystack に needle があるかどうかを調べるだけの場合、 より高速でメモリ消費も少ない strpos() を代わりに使用してください。 strposは、該当する文字列が見つからなかった場合は、falseを返す。 該当する文字列が見つかった位置を数値で返すので（※１）、型までチェックする必要がある。そのため、===falseもしくは!==falseを使うこと。 ※１例えば、strpos('abcd','ab')は0を返す。 if(strpos($subject,'bc') !== false){ //'abcd'のなかに'bc'が含まれている場合 } if(strpos($subject
PHP 5.3.4以降ではヌルバイト攻撃が成立しにくくなった - hnwの日記
今回はWebセキュリティの話題です。実はid:t_komuraさんの記事で既報なんですが、案外知られていない気がしたので改めて紹介します。 PHPアプリケーションに特化した攻撃手法として、ヌルバイト攻撃というものがあります。PHPの大半の関数がヌル文字\0（0x00）を文字として認識する一方、Cの関数を直接呼び出すような一部関数では文字列の終端文字として機能することがあり、このねじれを利用する攻撃のことを言います。 特に、これまではディレクトリトラバーサル脆弱性やLFI（Local File Inclusion）脆弱性との組み合せでヌルバイト攻撃が言及される印象がありました。例えば次のような状況です。 <?php function __autoload($class_name) { require 'lib/' . $class_name . '.php'; } $obj = new $_
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
THAICHI Co.,Ltd 有限会社泰地
【公式】ウエディングドレスのレンタル・購入｜ノバレーゼ
銀座の美容室 TREE(ツリー) | 銀座・東銀座 TREE hair&life design
Free 4K Stock Videos & Full HD Video Clips to Download
ハチログ