ホーム » ブログ

 2021年の祝日カレンダーの移動について

  • 2021/07/10

令和２年１２月４日 内閣官房東京オリンピック競技大会・東京パラリンピック競技大会推進本部事務局が2021年オリンピックのため、祝日をかきのように移動しました。
令和３年（2021年）に限り、「海の日」は7月22日に、「スポーツの日」は7月23日に、「山の日」は8月8日(※）になります。

 Cドライブを分割して新たなドライブを作成する方法

  • 2019/07/26

windows10またwindows7搭載されたパソコンの場合、初期状態はCドライブしかありません。本記事はCドライブを分割してDドライブまたはその他のドライブを新規作成する方法を紹介します。
ここからCドライブを分割して100GBのDまたはEドライブ新規作成の方法です。

１、管理者権限を持つアカウントでサインインしている状態で、[スタート]ボタンを右クリック　⇒　[ディスクの管理]
　※ショートカットキーの場合は、[Windows]キー + [X]キー) ⇒ [ディスクの管理]

 CSSのcounter()関数の実装サンプル

  • 2019/05/10

本日はCSSのcounter()関数の使い方を少し話していきたいと思います。
WEBページで順番などを表示する場合、直接番号をテキストで書くことがもちろんできます。
なお、ケースによって不便を招くこともあります。
例えば、コンテンツを番号を1～10付けてページに表示させるように作りました。そのあとに3番目のコンテンツを消したい場合、元の4番を3番に修正が必要となり、元の5番を4番に、つまり元4番～元10番のすべての番号を1個にずれるように修正しなければならない。
この時はcssのcounter()関数を使ったらスムーズに対応できる。

早速ですが、サンプルコードをここに載せて、ご参考ください。もちろん、コピペで使えます。

サンプル１：数字を順番につけて表示 


<html>
<head>
<style>
…

続く...

 iphoneXでメール追加設定方法

  • 2019/01/18

この記事はiphoneXでのメール追加する方法を掲載します。

（１）ホーム画面の「設定」アイコンを押して設定メニューを開く。

  • iphonexでメール追加方法


（２）設定メニュー画面を下にスクロールし、「パスワードとアカウント」を押下。…

続く...

 Chromeタブ切替での再読み込み禁止の設定方法

  • 2018/12/27

Chromeブラウザで複数の開いておいたタブを切り替え時に、勝手にページを再読み込みことがあります。正直これがウザいです。
また、ページのリロードにより様々の問題が出ており、特に注文完了画面や検索結果画面などのリロードで、エラー乃至二重注文などの致命的な問題が出る可能性があります。
当記事はChromeタブ切替時にページを勝手にリロードしない方法を紹介します。
１）Chromeブラウザを開き、URL欄にchrome://flags/を入力、Enterキー押したら、下記のページを表示…

続く...

 ｃｓｓ

  • 2018/12/21


@charset "utf-8";
/*************************************************
 * 共通定義
 **************************************************/
:root {
	--view-width: 94%;/* サイトの幅 */
	--mb-view-width: 98%;/* モバイルサイトの幅 */
	--base-color: #FFF;/* 背景色や余白など*/
	--main-color: #0d70f3; /* メインカラー：印象色 */ /* 2577e3,1d53a4*/
	--accent-color: blue;/* アクセントカラー:強調色 */
	--color-from:
…

続く...

 JS

  • 2018/12/21


/**********************************************
 *  ▼共通JS▼ 
 **********************************************/
$(function() {
	/* (F1)Globalメニュー初期化 */
	globalMenu.init();
	/* (F2)スマホメニュー初期化 */
	spMenu.init();
	/* (F3)スクロール初期化 */
	scrollEvt.init();

});

/*========================================
 * (F1)Globalナビー
 *========================================*/
var
…

続く...

 ｈｔｍｌ

  • 2018/12/21


<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>ジャイソル株式会社</title>
	<meta name="viewport" content="width=device-width, maximum-scale=1.0" />
	<!-- <base
…

続く...

 交差監視IntersectionObserverについて

  • 2018/12/14

画面スクロールによりある要素を画面表示に入ってきたら、あるイベントを引き起こせるニーズがあるかもしれない。
例えて言うと、画面ファストビューに入ってない画像やコンテンツなどを非同期に表示すれば、ユーザに快適的にページを閲覧ができます。
従来では独自のJS方法を各々に作成して、画面スクロールを計算し、監視対象がモニタに入ってきたら非同期でコンテンツを取得して表示できますが、
画面スクロールは頻繁に起こして、ブラウザの重くなる原因になります。
近年になって新しく導入されたIntersectionObserverを使えば、パフォーマンスへの影響を気にすることなく、要素の交差判定を簡単に実装することができます。…

続く...

 AJAXでコンテンツを取得して画面に表示

  • 2018/12/14

当記事はjqueryのajax非同期でコンテンツを取得して画面に表示の方法です。
既に検証済みのコードを貼り付けるので、ぜひご活用ください。

下記の例では、非同期でページのQRコード画像を独自のWEBAPIから取得し、id=page-qrcode-imgのタグに表示する。
もちろん、該当方法も後ほど筆者運営しているbenri.jpサイトに適用する予定です。 


$.fn.getPageQrcode = function (pageUrl,pageKey) {
  var send_data = {page_url:pageUrl,page_key:pageKey};
  // QRCode作成のWebAPI
  var webApi = "//www.benri.jp/calendar/umiwake";
…

続く...

 オラクルSQLでTRIMを利用したらパフォーマンスが悪くなる

  • 2018/11/01

オラクルでTRIMを利用するSQLのパフォーマンスが劇的に低い現象が発生しました。開発段階にテーブルのレコード数が少ない時にSQLの重さがかじってませんでしたが、
本番に近いデータを入れた後に検証したら、検索が重くてほぼ動けない状態に落ちってしまった。原因は下記のようなSQLです。 



select * from abc_tbl where TRIM(id)=#param_id# and del_flg <> '1';
上記のSQLで、インデックスを入れたけど、TRIMメソッドを利用のため、ORACLEのインデックス機能が利用できなくなって、パフォーマンスが非常に悪くなった…

続く...

 MutationOberverのサンプル

  • 2018/10/30

下記の例で、checkboxをON/OFFに状態変更したら、checkbox所属の親要素divのclass名にActiveクラスを入れる。
MutationObserverメソッドはdivのクラス名に監視し、クラス名の変更がありましたら、最新のクラス名を画面に表示する。
ソースをコピペで検証してね。 



<html>
<head>
<script type="text/javascript" src="https://www.benri.jp/js/jquery/jquery-1.9.1.min.js"></script>
<script>

$(function(){
	//監視対象Element
	var target =
…

続く...

 CSSでアコーディオン式のメニューを実装

  • 2018/10/18


僕が運営している別のサイトで既に実装しましたが、メモ帳としてここでアコーディオン実現する方法を掲載します。
では、いつもの流れで、ソースコードを貼り付けます。コピペでイメージ確認してください。 



<style>
.Accordion {
  max-width: 400px;
  border: 1px solid #ccc;
  border-top: none;
}
.Accordion__menu {
  
}

.Accordion__MenuLabel {
  height: 2rem;
  line-height: 1.8;
  font-size: 1.2rem;
  padding: 0.3rem 1rem;
  display: block;
  cursor: pointer;
…

続く...

 CSSでコンテンツを表示・非表示を切替

  • 2018/10/18

昔はJavascriptやJqueryなどを使ってコンテンツを切り替えで表示していました。本日はJSを一切に使わず、CSSのみでコンテンツ切替えで表示・非表示してみます。
当サイトのいつもの流れで、まずはソースコードを貼り付けます。コピペで実機検証してください。 


<style>
.TogglePanel__checker {
  display: none;
}
.TogglePanel__label {
  cursor: pointer;
  display: inline-block;
  padding: 10px 20px;
  border-radius: 4px;
  background: #0bd;
  color: #FFF;
  -webkit-transition: 0.1s;
…

続く...

 2020年限って7月8月及び10月の祝日移動

  • 2018/10/17

2020東京オリンピックの開催期間は2020年7月24日から8月9日までとなります。
東京オリンピックに向けて、2020年限って7、8月及び10月の祝日が東京五輪の前後に移動されました。
具体的には海の日（7月第3月曜日）を東京五輪の開会式前日の7月23日、体育の日（10月第2月曜日）を開会式の24日、山の日（8月11日）を閉会式翌日の8月10日にそれぞれ移されました。
そして、2020年から10月第2月曜日の体育の日をスポーツの日に改称される。（体育→スポーツはタダの文字遊びゲームでじゃ！いや、そうではない、カレンダー印刷会社や各企業が利用するシステムの改修作業が発生するから、企業に負担かけますが、ＧＤＰに貢献します）

2020年祝日移動に伴って、便利ジャパンは早くてもカレンダーの最新化に対応を行いました。…

続く...

1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19   次へ