レスポンシブなカルーセルを作る。

レスポンシブ対応のスライドショーやカルーセルプラグインはいくつかあるのですが、
今回は、画面サイズによって表示する数も変えるやつを実装してみました。
(といっても自分で一からJSを書いたわけではないです…)

続きを読む レスポンシブなカルーセルを作る。

フリックに対応したスライドショーを作ってみる(前回の続き)

どうも、髪を早く切りに行きたいpearmasterです
案件が立て込んでいる時に限って当番がまわってくるのは最早仕様ではないかと思ってしまうところ・笑

以前フリックに対応したスライドショーjCarouselをイジってみるという記事で非完全ながらもデバイスに応じたスライドショーを作ってみたのですが、
これがまーAndroidでの動きがダメダメすぎるorz
全くといっていいほど使いものにならない状況に。。。

これはマズい

非常にマズい、、、

ということで新たに捜索願を出してライブラリを探してみることに

続きを読む フリックに対応したスライドショーを作ってみる(前回の続き)

フリックに対応したスライドショーjCarouselをイジってみる

たまにはマジメな話を。。。

とある案件でレスポンシブルなサイトを制作することになったのですが、
その中でスライドショーを実装する場所が
・出来れば各デバイスごとに見え方を最適化したい
・フリック対応したい
とゆー希望が
うん、そうだね、みんな好き勝手言うね

そこで先生に泣きついて聞いてみると、
「jCarouselがいいんでね?」
との回答をいただきましたのでそれをコチョコチョいじってみることに
詳しい設定はくらげだらけさんのコチラの記事を参照していただくといいかと

ただ、このままだとPCでもサムネが1つしか表示されないので希望に合わない
ということでPCではサムネが3つ、スマホでは1つになるように改変してみました
テストページ

読み込んだ時は1つでリロードすると3つになるとか、
iPadあたりのデバイスには対応してないとか、
まだまだ不具合が出まくってますが、とりあえずの形になったかなと

外部リンクに自動でtarget=”_blank”を書き込むスクリプト

標題の件をご所望のようなのでスクリプトを書いてみました。

さくっと作ったのが以下のスクリプト

var siteDomain = location.href.split('/')[2];
var $a = $('a', '#main article .article-body');
$a.each(function(){
	var $this = $(this);
	var $href = $this.attr('href');
	var $hrefArr = $href.split('.');
	var n = $hrefArr.length;
	if((siteDomain !== $href.split('/')[2]) || $this.hasClass('download') || ($hrefArr[n-1] === 'pdf')) {
		$this.attr('target', '_blank');
	}
})

う~ん。。動くんでしょうけど、何かイケていませんねえ。
変数が多すぎる気がするのと、以前ブログにjQueryのeachメソッドは重いらしいと書いたので、その部分を減量。
続きを読む 外部リンクに自動でtarget=”_blank”を書き込むスクリプト