JavaScript
// ====== 読み込んだ時の処理 ====== window.addEventListener("load", function() { // 実行したい処理 // riyou_btn.disabled = true; // ボタン無効化 「利用するボタン」 // riyou_no_btn.disabled = false; // ボタン有効化 利用しないボタン」 dai_si…
こんにちは。どうもです。 学び舎の第二回は、ま～つかい古された、おみくじをやりたいと思います。 完成形URL http://tokotoko6667777.hippy.jp/omikuzi-blog/ 今回の大事な要点は、 自分で、確率を決める。 これは、改めて自分でコーディングしてみて、奥…
HTML ---------- <div class="container"> <div class="inner"> <div class="ChangeElem_Btn_Content"> <button class="ChangeElem_Btn">厳選ご当地</button> <button class="ChangeElem_Btn">カタログギフト</button> <button class="ChangeElem_Btn">スイーツ・食品</button> <button class="ChangeElem_Btn">アレルギー対応食品</button> </div></div></div>
動きはこんな感じです to 看護 jQueryのCDNは、 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> か <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> です。 ーーー html部分 <div id="contactWrap"> </div> に cssの 実際の動きはこちらで確認できます。 http://tokotoko66677…
jQuery(function(){ var setArea = jQuery('.scrEvent'), showHeight = 200; setArea.css({display:'block',opacity: '0'}); jQuery(window).on('load scroll resize',function(){ setArea.each(function(){ var setThis = jQuery(this), areaTop = setThis.…
functions.php --------- // スクロールアニメーション jsfunction scrollTop_script(){ wp_enqueue_script('scrollTop-script', get_template_directory_uri().'/link.js', array('jquery'));}add_action('wp_enqueue_scripts', 'scrollTop_script'); -----…
<p><img src="img/p_sp.jp" class="switch"></p> <styel> .switch{visibility: hidden; } </style> var setImg = $('.switch') , namePc = '_pc' , // PC用 nameSp = '_sp' , // スマホ用 switchwidth = 767; // 判別 setImg.each(function(){ var selfImg = $(this); function switchImg() { if(window.innerWidth > swit…
<html lang="ja"><head> <meta charset="utf-8"> <title>人気投票</title></head> <style> .gr4 > *{width: 23.4%; float:left;padding:0.4em;}img{width:100%; height: auto;}</style> <body> <div class="gr4"> <div> <p onclick='cnt("clk");'><img src="img/01.jpg"></p> </div> <div> </div></div></body></html>
<html lang="ja"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="stylesheet" href="css/style.css"> </link></meta></meta></meta></head></html>
<script type="text/javascript">/* 消し */$(document).ready(function(){jQuery("#got").delay(7000).fadeOut(1000);});</script> <script>/*-- 画面サイズ ピシャリ ---*/$(function(){ $(document).ready(function(){ hsize = $(window).height(); $("#to_img").css("height",hsize + "px"); }); $(window…
<html lang="ja"><head> <meta charset="utf-8"> <title>スロット</title> <style> body{background: #e0e0e0;font-family: Arial,sans-serif; font-size: 16px; margin-top: 30px;text-align: center;} .panel{display: inline-block; width: 60px; padding: 7px; border-radius: 5px; margin-bottom: 15px; co…</meta></head></html>
<section> <div class="scrEvent area1"><p>コンテンツエリア_1</p></div> <div class="scrEvent area2"><p>コンテンツエリア_2</p></div> <div class="scrEvent area3"><p>コンテンツエリア_3</p></div> <div class="scrEvent area4"><p>コンテンツエリア_4</p></div> <div class="scrEvent area5"><p>コンテンツエリア_5</p></div> </section>
<html lang="ja"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="stylesheet" href="css/style.css"> </link></meta></meta></meta></head></html>
<html lang="ja"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="stylesheet" href="css/style.css"> </link></meta></meta></meta></head></html>
<html lang="ja"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> </meta></meta></meta></head></html>
// お気に入りの作品を取り出す for CasperJS // 作詞掲示場のユーザー名とパスワードvar BBS_USER = "ユーザー名";var BBS_PASS = "パスワード"; // CasperJSを使えるようにするvar casper = require('casper').create();casper.start(); // 作詞掲示板のロ…
<html lang="ja"> <head> <meta charset="utf-8"> <title>Jquery メモ</title> <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script> </head> <body> <style>/*- fadeBTN フェードボタン hover*/ .fadeB…</body></html>
ユーザーエージェントが合わない × ------------ // Flickrでスクリーンショットを撮る var casper = require('casper').create(); casper.start(); // 画像サイズ指定casper.viewport(1400, 800); // UserAgentの指定casper.userAgent('User-Agent: Mozilla…
// CasperJS でスクリーンショットを撮る var casper = require('casper').create(); casper.start(); // ページを開くcasper.open('http://tokotoko6667777.hippy.jp/tossy-n/'); // スクリーンショット撮影casper.then(function(){ casper.capture("screen…
// リンクを解析してダウンロード // モジュール読みこみvar client = require('cheerio-httpcli');var request = require('request');var URL = require('url');var fs = require('fs');var path = require('path'); // 階層の指定var LINK_LEVEL = 3;// ペ…
// モジュールの読み込み var client = require('cheerio-httpcli'); // nodeのモジュールvar URL = require('url'); // 標準モジュール // URLとパラメーターvar url = "http://www.aozora.gr.jp/index_pages/person81.html";var param = {}; // ダウンロー…
<html lang="ja"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="stylesheet" href="css/font-awesome.min.css"> <title>ハンバーガーメニュー 2</title> <style> body { padding: 0; mar…</link></meta></meta></meta></head></html>
<html lang="ja"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="stylesheet" href="css/font-awesome.min.css"> <title>ハンバーガーメニュー 右 上 2つ</title> <style> body { padding: 0…</link></meta></meta></meta></head></html>
// モジュールの取り込みvar client = require('cheerio-httpcli'); // ダウンロード var url = "http://www.aozora.gr.jp/index_pages/person81.html"; var param = {};// fetch ダウンロードからページの解析ができるメソッドclient.fetch(url, param, fun…
index.html ----- <html lang="ja"> <head> <meta charset="utf-8"> <title>ホバーで表示</title> <link rel="stylesheet" href="css/style.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> </head> <body> <div class="col-4 gallery-item"> </div></body></html>
index.html --- <html lang="ja"> <head> <meta charset="utf-8"> <link rel="stylesheet" href="css/style.css"> <title>クリックで表示</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> </head> <body> <div id="read-more">もっと読む</div> <div id="more-text">…</div></body></html>
$(function(){ // SNSボタン $('.social-icon').hover( function(){ $(this).children('span').animate({ 'font-size':'30px' }, 300); }, function(){ $(this).children('span').animate({ 'font-size':'24px' }, 300); } ); // トップへ戻るボタン $('#top…
// urlにあるファイルを savepath にダウンロードする // ダウンロード元URLの指定var url = "http://tokotoko6667777.hippy.jp/tossy-n/"; // 保存先のパスを指定var savepath = "test.html"; // 利用モジュールの取り込みvar http = require('http'); // H…
index.html ----- <html lang="ja"> <head> <meta charset="utf-8"> <title>tab JS</title> <style> body { padding: 0; margin: 0; font-family: Verdana, sans-serif; } .container { padding: 0; margin: 30px auto; width: 500px; background: #dce0…</meta></head></html>
<html lang="ja"><head> <meta charset="utf-8"> <title>おみくじ</title> <style> body { background: #e0e0e0; text-align: center; font-size: 16px; color: #fff; font-family: Arial, sans-serif; } #result { margin: 30px auto; width: 180px; height: 180px; border-radius: 50%; line-height: 180px; font-s…</meta></head></html>
