Jquery

sikkuisikkuiです。

仕事でCSS3の効果をIEでも表現できるJavaScriptを一時期使用していましたが、不要な機能も一部あるためJavaScriptの読み込みに0.5秒ほど時間がかかってしまうことがありました。
現在進行している仕事でもCSS3の効果を使用しなければならない場所がありましたが、今までのJavaScriptを使用するとWebパフォーマンスを損なう恐れがあるので、Jqueryを使用して必要な機能のみを再現することにしました。
また外部リンクの場合、自動でアイコンを表示し、なおかつ自動で_blankを挿入するJavaScriptも必要でしたが、複数の他サイトのサンプルは簡潔ではなかったので、ついでなので作ってみました。
IE6~8,Opera,FireFox,Safari等で動きます。*Jqueryが必須です。

JavaScript

<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function(){
$("a[href^=http://]").not("[href^=自サイトURLを記載]").addClass("extlink")
.click(function(){
window.open(this.href, '_blank');
return false;
});
});
</script>

CSS

.extlink {
background:url(アイコンのURL先) bottom right no-repeat;
padding:5px 0 0 20px; /*アイコンの幅数値を入れて下さい。*/
}

トラックバック(0)

このブログ記事を参照しているブログ一覧: Jquery

このブログ記事に対するトラックバックURL: http://crebatec.info/mt4/mt-tb.cgi/1324

コメントする

 

株式会社クレバテックの紹介

WEB(ホームページ),DTP(パンフレット、ポスター、ロゴ)の株式会社CREBATEC

ホームページ、Webシステム、業務システムから、パンフレット、ポスター、名刺、ロゴ、キャラクター作成まで、御社のCI(コーポレート・アイデンティティ)をトータルでサポートし、企業価値を高めるお手伝いをさせていただきます。

クレバテック ブログをRSSに登録 RSSに登録

関連サイト