生活

Web制作

2020/7/21

フローティングバナーをCSS作る【Web制作】

この記事はフローティングバナーをCSS作る【Web制作】 へ移動しました。

生活

2020/2/12

法人向け!起業したてのオフィスの家具の初期コストを下げたい

起業してこれからガンガン仕事をしていこうとするときオフィスを用意するケースがあります。 バイトや社員をやとったり、客と打ち合わせをするのであればオフィスが必要になりますよね。 その時、困るのが「オフィスの家具」の導入です。 家具って仕事用途して揃えると結構高いので初期コストがかかります。 資金繰りの心配な状態ですと家具を揃えるための資金を用意するのも大変ですよね。 そこで近年利用されているのが【家具のサブスクモデル】「subsclife」です 「subsclife」代表的な導入事例 ポイント・株式会社PO ...

生活

2020/1/28

Amazonから「あなたのアカウントは停止されました。」の詐欺メールが届いたときに試すこと。内容とメールアドレスをよく見て!

AppleIDの詐欺メールが届いているケースが増えていますが、 Amazonのアカウントでも同様の詐欺メールが届きましたので警戒したい事例を紹介します。 突然Amazonから「あなたのアカウントは停止されました。」のメールが届く ぱっと見でAmazonのロゴが大きく表示されているので紛らわしいのですがこれは詐欺メールです。 メールの文面 お客様各位、 あなたのアカウント cherinuno@yahoo.co.jp は、疑わしい場所から最近アクセスされました。 内にこのメッセージを確認するまで、お客様のアカ ...

JavaScript Web制作

2020/7/12

【JavaScript】Swiperを使って端がちょっと見えるスライダーを実装する方法

数あるJavaScriptスライダープラグインの中で、 ・bxslider.js ・slick.js の著名ですが今回利用したのが「Swiper」です。 Swiperのメリット Swiperはオプションが多く、いろいろなスライダーを作ることができます。 ・IE11対応 ・jQueryが不要 ・スマホOKでタッチやスワイプにも対応 ・オプションがありすぎてちょっと面倒 とりあえず公式サイトにあるDEMOを見てみると実装できるスライダーの豊富さがわかります。 デモを見るだけでも大変です。IE11だと結構動作が ...

JavaScript Web制作

2020/7/12

【JavaScript】jQueryのSlideToggle()でアコーディオン開閉時にテキストを変更する。

アコーディオン処理を加えるときにとても楽ちんなのがjQueryのSlideToggle()です。 短い文でかんたんにアコーディオン開閉時を実装できます。 SlideToggle()とともに「もっと見る」「閉じる」のようなボタンのテキストを変化させたいことがあります。 今回はそのサンプルを紹介します。 javaScriptでやること ・SlideToggle()を実装する ・SlideToggle()の開閉を判別する ・テキストを変更する。 最初に必須なjQueryの読み込み方 jQueryをページに読み込 ...

メディアクエリ(Media Queries)が効かないときに確認したいこと

css Web制作

2020/7/12

メディアクエリ(Media Queries)が効かないときに確認したいこと

メディアクエリ(Media Queries)が効かないときに確認したいこと メディアクエリ(Media Queries)はスマホ向けのWEBサイトを作るのに必須な技術です。 メディアクエリを正しく記述しても効かないときがありましたので備忘録として記載しておきます。 メディアクエリ @media screen and (max-width: 320px); というように表示させるディスプレイサイズごとに CSSを記述していける書き方です。 CSSは原則として下に書く内容が優先度が高く処理されるため(イレギュ ...

スクロールしたらCSS3のグラフがアニメーションするようにする方法

JavaScript Web制作

2020/7/12

スクロールしたらCSS3のグラフがアニメーションするようにする方法

スクロールしたらCSS3のグラフがアニメーションするようにする方法 『アニメーションするグラフを作ってくれ』と言われてしました。 知らない間にアニメーションの需要が出てきているんですね。 少しWEBから遠ざかっていたのでこんなことができるようになっていたのは非常に驚いています。 たしかにアニメーションするグラフは見栄えが良いし、 企業のサイトを作成するとなると決算や社内状況を知らせるためグラフは不可欠な要素になります。 ちょっとリッチなページ、ひと目を引くページ作成で アニメーションをいれてくれと言われる ...

JavaScript Web制作

2020/7/12

【Chart.js】グラフを簡単に作れるJavaScriptライブラリ

Chart.jsはグラフをとても簡単に作っていくことができるJavaScriptライブラリです。 ・どのグラフにするか? ・どんな数値・メモリを入れていくか? と中身のデータを入れ替えていくだけでグラフが簡単に出来上がります。 エクセルなどのスプレッドシートでグラフを作る感覚に近いです。 グラフの初期テンプレートは用意されており色を変えるだけでなく、カスタマイズも出来ます。 グラフが表示されるときにアニメーションするのもポイントが高い点です。 グラフがアニメーションするとWEBページとしての見栄えも良いで ...

PhotoshopCC

2020/7/12

【Photoshop】テキストに下線を付けたい!テキストツールを使って方法が簡単!

Photoshopでテキストに下線をつける方法 PhotoShopでテキストに下線をつけるには 「テキストツール」の下線のボタンを押すだけです。 テキストツールを選択して文字を入力します。 メニューのウィンドウ > 文字を選択して文字ウィンドウを表示します。 下線を追加したい文字レイヤー内の文字を選択。 文字ウィンドウにある「下線追加ボタン」を押します。 ちなみに縦書きの場合には左側へ線が追加されます。 ただしこのテキストツールをつかって下線を加える方法は 『テキストと下線が同じ色になる』という点に注意で ...

JavaScript Web制作

2020/7/12

【JavaScript】「next()」「prev()」でjQueryで要素の取得して画像を変更する。

JavaScriptのライブラリとして一般的になったのが「jQuery」です。 いまだにjQueryを使ったサイトの案件はたくさんありますので、 JavaScriptの勉強をしていく上では逃げられないライブラリになっています。 「ボタンをオン・オフしてjQueryで画像を変えたい!」と言う時困るのが ・そもそもの画像の変える書き方がわからない ・画像を変える要素を選択する書き方がわからない というところでしょうか。 初歩的な内容ですが、とても需要があり使うことが多いため書き方を覚えておくと便利です。 jQ ...

no image

生活

2019/7/3

もし自分が住んでいる地域に避難指示が出たら?事前に知っておく警戒レベルと防災ハザードマップの存在

警戒レベルについて 気象警報・注意報に対して「警戒レベル」が定義されています。 気象庁 | 気象警報・注意報 避難勧告に関するガイドラインの改定(平成30年3月29日): 防災情報のページ - 内閣府 避難所開設状況の調べ方 一度はチェックしてどんなことが書いてあるか把握しておきたい防災ハザードマップ 「防災ハザードマップ(水害・津波・地震、土砂災害)」が各自治体からPDFで公開されています。 「千代田区 防災ハザードマップ」といったように「自治体名」+「防災ハザードマップ」で検索します。 この防災ハザー ...

アフィリエイト

2019/7/2

超便利!Google ChromeでTwitterアカウントの切り替える方法。アフィリエイトや複数アカウントの運用に。

Twitterアプリは複数アカウントの切り替えが可能 Twitterはメールアドレスがあれば複数のアカウントを持って利用ができます。 このアカウントは趣味用で、このアカウントは情報収集用で…と用途別にアカウントの利用を分けて使いたいシーンはよくあります。 Android,iPhone向けのTwitterの公式アプリではすでにアカウントの切り替えができるようになっています。 Twitter Twitter, Inc.無料posted withアプリーチ しかしPCのブラウザでTwitterを使っているとアカ ...

PhotoshopCC

2019/5/22

【Photoshop】クリップボードからコピペができなかった事例を解決した

【PhotoshopCC】ガイドラインを非表示にするショートカット

Javascript

Web制作

2020/7/12

古いサイトでたまに見かけるaタグ「javascript:void(0);」の意味【WEB制作】

Javascript 古いサイトの修正をするときに見かけることがあるのが 「javascript:void(0);」 aタグの画面遷移を無効化するために使われていますが、 どんなメリット・デメリットがあるのでしょうか。 「javascript:void(0);」のメリット ・aタグのhrefに書き込むとaタグの画面遷移を無効化 ・カーソルが「指カーソル」の形になるのでボタンの画像が視覚的に”押すもの”とわかりやすくなる。 ・表示枠をタブ化するときなどにURL欄に”#”などがつかない 「javascript ...

Web制作

2020/7/12

【Web制作】IE11でFlexboxが横並びにならなくてハマる

IE11でflexboxが横並びにならないとお客さん側から苦情が来てしまいました… 事前にIEはチェックしなくて良いと聞いていたので油断してましたね。 結論としては 「display: flex;」の記述が抜けていたこと。 IEだしdisplay:-ms-flex を書いておけば良いものだと勘違いしていたんですね。 IE11ではdisplay:-ms-flex;が読み込まれずにいて、 そもそもの「display: flex;」が抜けているとflexboxレイアウトができない という初歩ミスにハマってしまい ...

Copyright© さくらいらぼ , 2020 All Rights Reserved.