JQuery

background-colorを16進数で1ずつ増加させる

今回のゴール ボタンをクリックしたときに、background-colorの値が1ずつ増加していく。 というのをjQueryを使用して行っていきます。 (adsbygoogle = window.adsbygoogle || []).push({}); 使用するプラグイン RGB color parser in JavaScript / Stoyan's …

windowの幅に応じてページを拡大・縮小する

画面の大きさはパソコンによってそれぞれなので、それに見合った表示が出来れば良いなと思い挑戦してみました。 $(function(){ var wi = $(window).width(); if ( 960 <= wi <= 1280 ){ $('body').css('zoom','67%'); } else if ( 1281 <= wi <= 1600 ){ $('…

return false

$(function(){ $('a').click(function(){ $('img').attr('src','book.jpg').attr('alt','本'); }); });<a href="book.jpg">画像を変更する</a> <p><img src="pen.jpg" alt="ペン"></p>a要素をクリックするとclickイベントが発生して画像が変更されるはずですが、 その後にブラウザはhrefに設定したリンク先へ飛んでしまい…

nth-childとnth-of-typeの違い

nth-childのscript部分 $(function(){ $('p:nth-child(even)').css('color','#00F'); });p要素の偶数の文字を青色に変える html部分 <h1>勉強の科目</h1> <h2>文系</h2> <p>古典</p> <p>日本史</p> <p>英語</p> <h2>理系</h2> <p>物理</p> <p>数学</p> <p>科学</p> 結果 となります nth-of-typeの場合 $(function(){ $('p:nth-of-ty…