ブログで投稿した元画像へのリンクがついた画像の<a>タグに
rel要素やらclass要素やらを追加してやる場合。


$(document).ready(function($){
 $('#hoge a[href$=".jpg"], #hoge a[href$=".jpeg"], #hoge a[href$=".gif"], #hoge a[href$=".png"]').each(function(){
 var imageTitle = $('img', this).attr('alt');

 $(this).attr('rel', '任意の名前').attr('class', 'imageLink' ).attr('title', imageTitle);
 });
});


なぜこんな事をする必要があったかっていうと、
ブログで追加した画像をlightboxで拡大表示したかったからです。

wordpressのプラグインがうまいことさどうしてくれんかったので
普通にjQueryのブラグインでなんとか。

参考サイト様


ぬるぬるスクロールボタンはスマホではいらない・・・
というかむしろ邪魔だと思ったので640pxよりウインドウサイズがでかい時だけ機能すればいいじゃない。

jQuery(function () {
 jQuery(window).scroll(function () {
 var w = $(window).width();
 var x = 640;
 if (w > x){
 if (jQuery(this).scrollTop() > 100) {
 jQuery('#toPageTop img').fadeIn();
 } else {
 jQuery('#toPageTop img').css("display","none");
 }
 }
 });

});
jQuery(function() {
 //ページ上部へ戻る
 jQuery("#toPageTop img").click(function () {
 jQuery('html,body').animate({ scrollTop: 0 }, 900);
 return false;
 });

});


これはわりとすんなりできた。
自分といたしましては。

jQueryはPHPみたいにif文を分けて書く書き方ないのかな。
いっつも()とか{}がどこの何がどれがそれでここ誰で俺はどこ?ってなる。


あい。
いつも一方的にお世話になっているwebクリエイターボックス 様のページトップへ戻るナビが
素敵だなーと思ったので猿真似しましたw

とりあえず、ナビゲーションをposition:fixedで表示したい位置に固定。
その後


$(function () {
 $(window).scroll(function () {
 if ($(this).scrollTop() > 100) {//100px以上スクロールしたらばナビがフェードイン
 $('#toTop').fadeIn();
 } else {
 $('#toTop').fadeOut();//そうでなkればフェードアウト
 }
 });

// scroll body to 0px on click
 $('#toTop').click(function () {
 $('body,html').animate({
 scrollTop: 0
 }, 800);
 return false;
 });
 });


webクリエイターボックス様ではjsでナビを.hide()されてたんですが、
そのやり方では一瞬ナビがちらついたので、うちではCSSでdisplay:noneしていしています。

それにしてもハッスルサーバー最近糞重い。
移転しようかなぁ・・・。


(function($) {
var cache = [];
// Arguments are image paths relative to the current page.
$.preLoadImages = function() {
var args_len = arguments.length;
for (var i = args_len; i–;) {
var cacheImage = document.createElement(‘img’);
cacheImage.src = arguments[i];
cache.push(cacheImage);
}
}
})(jQuery)

jQuery.preLoadImages(“/path/to/xxx.png”, “/images/zzz.jpg”,);

で、いけるわけだけど・・・
画像をいちいちパス書いていくのがだるいだよねー。
フォルダ直下の画像フォルダごとプリロードとかしようと思うと
けっこう難儀なコードを書かないといけないみたい。
jsとPHPの複合みたいな。

無理だー!!!

もっぺんいちからjsとphpがっつりお勉強したい。
でも普通に実務こなしてるほうが力つくってはなしもある・・・
っていうか現場の人はみなそういうよねw


ページを読み込んだ時に
好きな高さ(位置)を指定して読み込む方法。

window.onload = function Scroll300() {
window.scroll( 0, 300 );
}

だ!