サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
Pixel 9
vegl.biz
今回はWEBデザインあるあるです。 クライアントから「この画像を修正して欲しい」と言われ、修正してFTPアップロードして一息… 自分のPCで見る分にはしっかりと修正後の画像が表示されているのにクライアントからは「前の画像のままです、どこが修正されてるのか小一時間説明して下さい。」と言われる事ってありますよね? クライアントに「更新されない場合はスーパーリロードしてください」だとか説明するのも不親切だしこっちも面倒くさい。 そんな時の対処です。 っというかそもそも画像を修正してアップロードする時は必ずやってることですが。 画像の後ろにゴミを付ける! 例えばこんな画像を更新したとします。 <img src="sample.jpg" alt="ふにふに" /> このままではブラウザを更新しても画像が修正前のまま、という事があります。 ※ブラウザのキャッシュの機能が悪さをしてるのですが、キャッシュ
自サイトのリニューアル様に実装したエフェクトのメモです。 「ページ上部までスクロールするボタン」と「トップページに遷移するボタン」の画像をキャラクターにしたところ、 先輩に と言われたのでちょろっと動かしてみました。 それと同じデモがこれ↓ DEMO ※このブログ右下にも動きを激しくしたのを実装しました jqueryを読み込む ご存じjquery、今の時代どのサイトでもだいたい読み込まれてますよね… <script type="text/javascript" src="jquery.js"></script> animate.cssをダウンロードして読み込む animate.cssというcssライブラリがあります。 CSSでアニメーションさせるためのクラスがたっぷり詰まってます。 公式サイトではアニメーションを選んでAnimate it ボタンをクリックするとサンプルを見られます。 まず
ワタクシのおじいさんが教えてくれた初めてのjavascriptライブラリ、 それはjqueryでワタクシは4歳でした。 そのコードは面白く簡単で、 こんな素晴らしいjqueryを教えてもらえるワタクシはきっと特別な存在なのだと感じました。 今ではワタクシがおじいさん、孫に教えるのはもちろんjquery、 なぜなら、彼もまた特別な存在だからです。 はい、jqueryは言うまでもなく素晴らしいですね! 最近ではスマートフォン用サイトのド定番のハンバーガーメニュー、 これもjqueryで探せばたくさんありますが、 まぁ、CSSだけで出来るならそれに越したことはありませんね… という事で、CSSだけで実装するハンバーガーメニューです。 デモ 一先ずデモをつくりました。 DEMO コード htmlはこんな感じ <!--▼▼ハンバーガーメニューここから▼▼--> <div class="hm_wrap
CSSで角丸を作る方法 人類がCSSで角丸を作れるようになって早数年が過ぎた… 割と今更ですが、とっつぁんは結構CSSの角丸を作るときに「上だけ」とか「右上だけ」とか指定しようとして書き方を忘れてることが多いので備忘録です(笑) 左上・右上・右下・左下すべてを角丸にする場合 ※これ正直覚えなくていいです。 全部を角丸にする場合はとりあえずこう書きますよね。 border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; 一か所だけ角丸にしたい場合 1か所だけ指定したい場合はこう… 左上のみ border-top-left-radius : 10px; -webkit-border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; 右上のみ
カテゴリー キャラクター別 (820) 男性 (334) うりぼぅ (106) とびぃ (111) はたさん (34) 妖精さん (30) 准さん (35) とっつぁん (25) 女性 (502) あーたむ (201) みーたむ (135) うりねぇ (27) 座敷あらし (56) むこりん (105) 性別不明 (10) コスチューム (340) 制服・学校系 (122) 日常・私服系 (101) 和風 (65) 民族衣装 (22) ヒーロー・ヒロイン (7) アニマルスーツ (32) ビジネス (378) スーツ・セミナー (156) OL・事務員 (152) 接客業 (9) 医者・白衣 (25) 作業服・ガテン系 (14) 農業 (1) 悪徳業者 (18) 飲食店 (57) 料亭・和食 (20) レストラン・コック (4) カフェ・バー (22) ラーメン屋 (7) スポーツ (32
※高さを内容に合わせたいと言うコメント頂いた為、ちょっぴり編集しました。 アコーディオンメニューとは、クリック(タップ)すると隠れていたメニューが出てくるヤーツです。 スマフォ用のナビゲーションとかにも使われていたりしますね。 今まではこういうメニューはjqueryを使うのがわりと一般的でした。 が、htmlとcssだけでも実装できるのよ、という時代になって来たのでご紹介。 ちなみにクソブラウザ(ワタクシのスマフォ標準ブラウザ)でも動きます。 ひとまずコピペでオッケーです。 チェックボックスを使用したアコーディオンメニュー html <div class="ac_menu"> <label for="nav01">メニュー1</label> <input type="checkbox" id="nav01" class="bellows" /> <ul> <li><a href="">ナビ
このページを最初にブックマークしてみませんか?
『VEGLコンテンツ – イラスト素材・写真素材・ホームページのネタ等!』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く