こんにちは。コバヤシです。 今回はVue.jsでドラッグ&ドロップでソートする方法について書きたいと思います。 Vue.Draggableをインストールする Vueでドラッグ＆ドロップをするならこれっていうくらい定番のライブラリです。 github.com まずこれをインスト…

こんにちは、ナカムラです。 スタティックのHTMLページを作成している中で、商品情報など、 同じレイアウトを繰り返すコンテンツがあります。 数が少なければ手作業で書き込めば良いですが、10件、20件ともなるとなかなか大変な作業になります。 そこで今回…

こんにちは、ナカムラです。 今回はスマホサイトではお馴染みのハンバーガーメニューの作り方をご紹介します。 タイトルに「階層の深い」と書きました。 ページ数の多いサイトでは、第2階層、第3階層とメニューが深くなっていきます。 階層が深くなるとメニ…

こんにちは、ナカムラです。 今回は文字数などのコンテンツ量によって表示を制限するJavaScriptを解説していきます。 jQueryを使わないネイティブでの書き方になります。 ※IEにも対応したい場合は注意点があります。詳しくは解説の中で記載しています。 作り…

こんにちは、ナカムラです。 今回はjavaScriptのプラグイン「Shuffle.js」を使って絞り込みとソートの実装をしてみたいと思います。jQueryは使用しません。 オプションがいろいろありすぎて読み解くのがなかなか辛かったので 一番シンプルな絞り込みとソート…

こんにちは、中村です。 今回はこちらの記事で紹介されている「rel="noopener”」という属性について確認していきたいと思います。 「Firefox 79」が正式リリース ～Windowsで新レンダラー「WebRender」の適用を拡大 - 窓の杜 記事の内容はFirefox79の仕様でr…

こんにちは、中村です。 今日はvue.jsを使って簡単なレコメンドを行うコンテンツを作ってみました。 概要 質問の答えに対して、おすすめしたい情報を表示します。 今回はシンプルに質問は2つ用意しました。 2つの答えの組み合わせにより、表示結果が変わりま…

こんにちは、中村です。 今回はjQueryなどを使わないネイティブJavaScriptでのタブの作り方をご紹介します。 デモ See the Pen ネイティブJavaScriptでタブを作ろう by Nakamura (@takayo-nakamura) on CodePen. 動作の解説 （1）タブメニューをクリックされ…

加藤です。 そろそろ春…？と思いきや寒い日があったりするので風邪をひきそうですね…。 シリーズPart4.5です。前回の記事はこちら。 tech.arms-soft.co.jp 前回、onEdit()トリガーを使って、スプレッドシートの条件付き書式もどきを作成しました。 ToDoリス…

新年あけましておめでとうございます。加藤です。 本年もどうぞよろしくお願いいたします。 シリーズPart4です。前回の記事はこちら。 tech.arms-soft.co.jp （１）はじめに スプレッドシートで条件付き書式を使うと見やすくなってよいのですが、ドキュメン…

加藤です。もう12月とか信じられないです。 シリーズPart3です。前回はこちら。 tech.arms-soft.co.jp またもや例がテスト項目表なのですが、 結果の◯,×で集計ができたらいいかも？ 日付ごとに消化率を計算できるようになったら、進捗がわかりやすい？ と色…

遅ればせながらcanvasを勉強し始めました。 「ちょっと動きが欲しいんだけど」にサクッと応えたい。 そもそもcanvasってなんなんだ？というところからのスタートです。 単純なアニメーションならtransitionやanimationなど、CSSだけである程度は動かせますが…

加藤です。次にブログ記事を書く頃にはたぶん健康診断が終わっているはず。今からびくびくしております。 前回に引き続き、GoogleスプレッドシートでGASを使っていきます。 tech.arms-soft.co.jp はじめに 文書作成作業をしていると、シートの全域、または特…

通勤時の日差しの強さに生命の危機を感じます。加藤です。 開発のたび、設計書や仕様書などの文書作成になかなか時間がかかってしまうのが、個人的な反省点です。 共通のフォーマットが使えそうな場合はテンプレートファイルにしたり、似たような文章表現が…

こんにちは、ナカムラです。 前回の記事でVue.jsを使った簡単なゲームを作ってみました。 今回はそのゲームに一つ機能を付け加えたいと思います。 ※ゲームの概要は前回の記事をご覧ください。 tech.arms-soft.co.jp 追加する機能 【 スコアを保存して表示す…

こんにちは、ナカムラです。 今日はVue.jsを使って簡単なゲームを作ってみたのでご紹介します。 ゲームの概要 作ったのは運試しゲーム。 １・２・３と３つあるボタンのどれかをクリックするとランダムで１〜３の数字が出ます。 押したボタンの数字とランダム…

こんにちは！コバヤシです。 仕事でカレンダーを実装するにあたり「FullCalendar」を使う機会があったのでメモ的にまとめてみました。 まずはダウンロード https://fullcalendar.io/download/ に行ってzipをダウンロードして解凍します。 カレンダーを表示し…