jQuery
開発環境は、Windows10 Pro(64bit) + Firefox 69.0.3(64bit)。例えば、ボタンをクリックして、モーダルを表示させるときなど、ウィンドウ以外の背景部分のコンテンツの上に、分かりやすくするために、透過した色の背景をオーバーレイして、クリックできない…
TwitterのDM部分は、スクロールが最初から一番下に位置していて、一番上に持っていくと、無限スクロールによって、古いDMが読み込まれるような構造です。最初に投稿した段階で、メッセージは一番下に来るようにするには、positionをabsoluteにしなくてはいけ…
開発環境は、Windows 7 Professional(32bit)例えば、査定サイトで査定価格の金額を0円から査定価格までタイマーで動かして見せる動作を加えるとする。0円から査定価格の1/10ずつ増やしていって、査定価格に達したら、査定価格と切り替えてタイマーを破棄する…
開発環境は、Windows 7 Professional(32bit)+Firefox 58.0.2(32ビット)+jQuery 3.2.1。1.サイトへアクセスする GitHub - emojione/emojione: EmojiOne™ is the open emoji standard. #iwantemojione 2. /lib/js/emojione.min.jsへアクセスし、コピペしてemoj…
開発環境は、Windows 7 Professional(32bit)+Firefox 58.0.2(32ビット)+jQuery 3.2.1。HTML側 <div id="size"></div> <div id="size2"></div> jQuery側 $(window).on('load resize',function(){ $('#size').html('windowの横幅:' + $(window).width()); $('#size2').html('スクロールバーも含めたwindow…
開発環境は、Windows 7 Professional(32bit)+Firefox 58.0.2(32ビット)+jQuery 3.2.1。下記の例だと、黒い四角内をクリックすると『親要素』というアラートが表示され、赤い四角内をクリックすると『子要素』→『親要素』と2回アラートが表示されてしまう。HT…
開発環境は、Windows 7 Professional(32bit)+Firefox 58.0.2(32ビット)+jQuery 3.2.1。ボタンをクリックすることでページの下部に、メッセージを3秒間させるアニメーションを作成する。heightが0pxなので、読み込んだ時点では、Message部分は見えない。HTML…
開発環境は、jquery-3.2.1.min.js。マウスカーソルを合わせた*部分を、太字にして、話したら、元に戻す。 『liが先頭に追加』ボタンをクリックすると、先頭に、青い*が追加され、『liが末尾に追加』ボタンをクリックすると、末尾に、赤い*が追加される。 か…
【問題】スクロールした途中で、一番上まで戻るようにする ・id属性がright-bottom-naviの部分をクリックすると上まで戻るようにする。 【解決】 $(function(){ $('#right-bottom-navi').on('click',function(){ window.scrollTo(0,0); }); }); 上記のコード…
開発環境は、Windows 7 Professional(32bit) + Firefox 58.0.2(32bit)です。複数の同じclass属性のボタン要素があったときに、どこか1箇所にマウスホバーすると同じclass属性の全部のボタンが変化してしまいます。それを防いで、マウスホバーした1箇所のみ変…
開発環境は、Windows7 Professional(32bit)+firefox 57.0.2(32bit)+jQuery3.2.1。 <html lang="ja"> <head> <meta charset="utf-8"> <script src="jquery-3.2.1.min.js"></script> <style> </style> <script> var s_count = 0; var m_count = 0; var h_count = 0; $(document).ready(function(){ $(function(){ se…</meta></head></html>
開発環境は、Windows7 Professional(32bit)+firefox 57.0.2(32bit)+jQuery3.2.1。 <html lang="ja"> <head> <meta charset="utf-8"> <script src="jquery-3.2.1.min.js"></script> <script> $(document).ready(function(){ var canvas = $("#rect")[0]; if(canvas.getContext){ var context = canvas.getContext('…</meta></head></html>
