[B! JavaScript][javascript] [2ページ] hattoushinhaのブックマーク

jQueryで親要素のスタイル変更 : JSをつらつらとダラダラと書く

CSSで<a>のスタイルを変えるってのはよくやる。。 ▲たとえばこんな感じかな。hoverしたときにオーバーラインもでるように操作してる。 <div style="background-color:#FFC; padding:5px;"> <a href="javascript:void(0);">リンク1</a> </div> <br /> <br /> <div style="background-color:#FFC; padding:5px;"> <a href="javascript:void(0);">リンク2</a> </div> ▲HTMLはこんな感じでぇー、 a{ color:#333; } a:hover{ text-decoration: underline overline; } ▲CSSのソースはこんな感じ。でも！ ▲こんなこともしたいよねぇ。一つ上の階

hattoushinha 2012/05/31

リンク

Twitterのつぶやきを、3行のコードでWebサイトやブログに表示させる - かちびと.net

この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。お問い合わせを頂いたのでついでにご紹介。Twitterのウィジェットのようなものをお探しだったようですが、現在の公式のウィジェットではなく、色々とcss でカスタマイズ出来るようにしたいというご希望でした。Twitterの投稿を表示するだけなら3行もあれば実装出来ます。タイトルはやや釣りに近いです。知らない方向け。 Webクリエイターボックスさんで表示されてるような感じにしたい、というご希望でした。なぜ僕に質問して頂いたかは謎ですがお答えさせて頂きます。ウィジェットやjQuery、RSSを使って～等、色々と方法はありますが、自分で表示もデザインしたい、シンプルでいいというのであれば3行もあれば表示させる事が出来ます。 APIキーを取得して～等の面倒な手

hattoushinha 2012/05/29

リンク

[cssメニュー]マウスオーバーで滑らかに別要素をドロップダウンさせるjQuery・Fluid Navigation - かちびと.net

この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。最近存在を知ったのでメモ。 1ヶ月も前の情報ですけど、今更ながらなかなか良さそうなプラグインです。cssメニューでのマウスオーバーで使う jQueryプラグイン。デモを見ていただいたほうが早そうですね。マウスオーバー時にリスト内に書いたdiv要素に切り替えつつドロップダウンさせるjQuery。なんとなく説明が難しい。。。マウスを乗せると別の要素が滑らかに降りてきます。デモは画像不使用です。なかなか良いのでは。 IE6~8も動く事は動きますが、若干挙動が怪しい。。 [sexy-lightbox href=’/wp-content/demo/fluid-menu/fluid-menu.html?TB_iframe=true&height=650&width=9

hattoushinha 2012/05/23

リンク

レスポンシブに対応して画像をポップアップ表示してくれる素敵なjQueryプラグイン「fancyBox」 – bl6.jp

とても有名なプラグインですが、今まで使ってみたことがなかったので試してみました。Lightbox風に画像をポップアップして表示するjQueryのプラグインです。以前紹介したColorBoxに似たような感じです。こちらのfancyBoxはバージョン2になってからレスポンシブになっているみたいです。その他にもヘルパーを使って拡張機能なんかも色々つけれるのでとてもバリエーション豊な印象を受けました。ということで適当なサンプルも作ってみましたので、以下使い方と合わせてどうぞ。 [ads_center] 使い方以下のURLからファイルをダウンロードします。 fancyBox – Fancy jQuery Lightbox Alternative jQuery本体とCSS、JSファイルを読み込みます。 <link rel="stylesheet" type="text/css" href="jque

hattoushinha 2012/05/22

リンク

Youtubeの動画を背景に

Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest techno logies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp