Technology #mac#ruby 2020/06/29 【Ruby】Rubyのインストール手順と動作確認(Mac用) 今回は、Rubyのインストール手順を紹介していきたいと思います。また、インストール完了後に正しくRubyがインストールされているか動作確認もしていきたいと思います。Rubyのインストールはとても簡単なのでRubyに興味の […] Read more
Technology #css#html 2020/06/16 [css]下へと上下に揺れてる下向き矢印ボタンをどうやって作るのか? 今回は、ホームページ閲覧時に下に移動するための上下に揺れている矢印がありますよね?jqueryなどを使わないとできないのかと言われますとcssのみで実装可能です。では作っていきたいと思いますが、この記事では、位置は下にせ […] Read more
Technology #css#html 2020/06/15 [css]htmlのaタグをクリックできないようにする方法とは? ホームページのメニューバーなどで、準備中にしたりすることってないですか? 少なからずそういった機会ってありますよね。リンクにせず、文字だけ打っておいて後からリンクにしておくことや、飛んだ先のページを準備中にするなど様々な […] Read more
Technology #php 2020/06/14 [php]foreachを使ってみよう phpで配列の中身を全て出力する方法をご紹介したいと思います。foreachを使うことで配列の中身を1列ずつ出力することができるようになります。今回はよく使われるこのforeachの使い方についてご紹介したいと思います。 […] Read more
Technology #css#html#js 2020/06/13 [jquery]slick.jsを使ってスライダーを作ってみよう 今回は、スライダーを作ってみようと思います。ホームページにはトップページにスライダーがあるホームページがやはり多いですよね。そんな幅広く使えわれているスライダーを作っていきます。作り方は非常にシンプルで、slick.js […] Read more
Technology #css#html 2020/06/12 [css]背景に画像を入れた際に位置調整を行うにはどうすればいいのか cssを使って画像を背景に設定することってありますよね。今回は設定した背景画像の位置調整をする方法をご紹介したいと思います。背景画像を左側に寄せたい、背景画像を中央寄せにしたい、背景画像を右寄せにしたいなど様々な要望があ […] Read more
Technology #js 2020/06/11 [js]jqueryでログを出力するにはどうすればいいのか 今回は、jqueryのログの出力方法について書かせていただきます。 jqueryでログを出力することは、取得したデータや、テキスト文などを確認するために使われます。jqueryを使って様々な操作を行う際には、必須となる知 […] Read more
Technology #html 2020/06/10 [html]セレクトボックスを作ってみよう 今回は、htmlでセレクトボックスを作ってみようと思います。セレクトボックスは入力フォームを作る際には、一般的な入力フォームになります。基本的なことなので、ぜひ覚えていってください。一般的なセレクトボックスだけでなく、分 […] Read more
Technology #html 2020/06/09 [html]ラジオボタンを作って、チェック済みにしたり選択できないようにしてみよう htmlでラジオボタンの作り方をご紹介したいと思います。ラジオボタンは、フォームを作る際に、一つだけ選択肢を選んでほしい時に使われてますね。 今回はそんな入力フォームを作る際に必要なラジオボタンの作り方をサンプルを踏まえ […] Read more
Technology #css#html 2020/06/08 [css]横並びで高さを合わせたコンテンツを縦方向に中央寄せする方法 cssでdisplay:flexを使用した際に、横並びの高さを合わせられたけど、縦方向に中央寄せできないという方向けの記事となります。 display:flexを使うことで、高さを合わせたコンテンツを横並びにすることはで […] Read more
Technology #css#html 2020/06/07 [css]横並びにしたコンテンツの高さを合わせる方法 今回は、cssで横並びにしたコンテンツの高さを合わせる方法をご紹介したいと思います。 cssでブロックを横並びにするまではできたけど高さが合わないっていう時ありませんか?横の長さを合わせるのは簡単ですが縦方向のアプローチ […] Read more
Technology #css#html 2020/06/06 [css]ワークフロー図をcssだけで作ってみよう ホームページにて、手順を説明する際に、手順1、手順2などを表記する必要が出てくるかと思います。ただワークフロー図をどうやって作っていいかわからないといったお悩みがある方が少なからずいらっしゃるかと思います。 そこで、今回 […] Read more
Technology #css#html#js 2020/06/05 [jquery]クリック時に矢印を動かして展開したことがわかるアコーディオンの作り方 アコーディオンメニューで開閉を行う際に、開閉されてるかわかるように下向きの矢印がついていることがないですか?開いてない状態では下向きの矢印がついていて、開くと上向きの矢印がついている状態です。 矢印をつけることで開閉して […] Read more
Technology #css#html 2020/06/04 [css]下向き矢印と上向き矢印の作り方 今まで矢印はどうされていましたか?画像で作られていましたか? 実はcssで作成することができます。作り方は非常にシンプルで四角形を回転させるだけといったものになります。 今回は、下向き矢印と上向き矢印の作り方をご紹介した […] Read more
Technology #css#html#js 2020/06/03 [jquery]slideToggleを使ってアコーディオンを作っていよう 今回は、queryのslideToggleを駆使してホームページでよく使われるアコーディオンを作ってみようと思います。 アコーディオンは、Q&Aやメニューバーなどある程度の複数のコンテンツを一覧と表示させ、詳細が […] Read more
Technology #css#html#js 2020/06/02 [jquery]切り替えタブを作ってみよう 今回はよく使われるタブを作ってみようと思います。 一々、コンテンツ縦にいっぱい並べて表示させるって大変ですよね。タブを作ってコンテンツを切り替えられたら一番いいですよね。今回はそんなタブを作って見ます。考え方は、押したボ […] Read more
Technology #html#js 2020/06/01 [jquery]テキストボックスが入力された時にどんな文字が入力されているのかを取得してみる 今回は、jqueryを使って、テキストボックスに入力された文字の取得方法についてご紹介したいと思います。テキスト入力に入力された文字を取得することで、入力された文字がどんなものなのか、入力形式として正しいのかどうかという […] Read more