Webデザイン

Webデザイン

マウスオーバーに合わせて拡大、縮小させる方法

はじめに 私のサイトにも色々な動きを取り入れてみたいと思い、今回は「マウスオーバーに合わせて拡大、縮小させる」という動きを実装してみました。  参考サイト 今回は以下のサイト様を参考にさせていただきました。 要素を...
Webデザイン

ページ内リンク先へ滑らかに動かす方法

はじめに 今回は、ページないリンクをクリックした時に滑らかにスクロールするように設定してみました。 これを機に、このサイトでも目次の各項目をクリックした際も滑らかにスクロールするように設定してありますので、試しにクリックしてみ...
Webデザイン

はてなブログでの目次の作成方法

はじめに 今回ははてなブログにおいて、簡単に目次を作成する方法について紹介してみようと思います。 今回ははてなブログに最初から備えられている目次作成用のツールを使用します。 以前の記事でも、HTMLで目次を作成するという...
Webデザイン

jQueryでマウスオーバー時の文字色の変化を実装

$(function(){ $('#test').on('mouseover', function(){ $('#test').css('color', '#ebc000'); }); }); $(func...
Webデザイン

はてなブログでjQueryの動作確認

はじめに 今回ははてなブログでJQueryを試しに実行してみました。  JQueryとは 私も勉強不足ですので、調べてみました。 JQueryはJavaScriptを書き方を簡単にするためのJavaScriptのラ...
Webデザイン

はてなグログに問い合わせフォームを作る

はじめに 今回は、このサイトに問い合わせフォームを作成してみました。 実は以前にも作成した事があります。 しかし、ブログを始めたばかりで操作にも慣れておらず、問い合わせフォームを削除したまま、放置していました。 こ...
Webデザイン

パンくずリストのデザイン変更

はじめに はてなブログにおいて、パンくずリストを少しデザインを変更しようとふと思いました。 はてなブログのデフォルトのデザインでは少し物足りない感じが否めません。 今回は実際に調べて実践し、その結果を紹介して見たいと思い...
Webデザイン

サイト上で動画ファイルを再生する方法

はじめに はてなブログにおいて、動画ファイルをHTMLに埋め込む方法を考え、調べました。 その結果、ストレージサービスを利用するとうまくいきそうだと分かりました。 そこで、先日の記事↓では「Cloudinary」というス...
Webデザイン

HTML上でプログラムコードを見やすく表示

内容 HTML上、主にサイトなどにプログラムのソースコードを記述する場合、 改行や色分け表示がされたプログラムソースコードを表示する方法を紹介したいと思います。 表示例 表示例のHTMLソースコード <script&...
スポンサーリンク
タイトルとURLをコピーしました