WEB制作

1/2ページ

簡単!スマホ用メニュー|3本線のハンバーガーメニューと、その下に「menu」という文字

こんにちは、寒くなってきました。 副業フリーランスも、うさぎ雑貨制作も最近ちょっとサボり中のマッツォです。 久しぶりによく使うコードをメモとして残しておこうと思い久しぶりにブログを開きました。 スマートフォンのときだけ3本線のメニューが右上にでてくるアレです。 やりたいこと 3本線のハンバーガーメニュー 3本線の下に「menu」と言う文字もついているもの クリックして開いている時は「これクリックし…

文字が左にグググッと寄って重なって表示されてしまう時の対処法

先日、IE8でこんな風にページ内の文字が表示されてしまいました。 動き的には、最初はちゃんと表示されるものの、JSを読み込んでいるタイミングでこうなってしまっている様子の動き方をする。 そこでページ内にあるjQueryのプラグインをひとつづつ取っていってもなぜか解消されない。 あまりナイ症状なのか、それとも基本的ななにかをすっ飛ばしているからこうなったのか?(基本的な部分のCSSを見直してみたつも…

formに入力した文字、CGIに遷移したら文字化け!?修正はたったこれだけ。

  • 2016.09.20

formのテストをしていました。 必須項目を入力して「送信!」 そしたら・・・・form.cgiの画面にて・・・・ これ。 よく見ると、どうやらEUC-JPでなければならない様子。 でも、ページもうUTF-8で作ってるしな・・・・・ そう思ってどうにかこのままでなんとかできないかとぐぐってみたところ、formタグにひとつ足すだけでどうやらいけそうだ。 ただし、IE対応とか、戻るボタンで戻ってきた場…

プラグイン「Bogo」で多言語サイトを簡単に作る!

グローバル化は進む進む。 外国語対応を求められる制作も増えてきた今日この頃です。 WordPressで日本語と、翻訳した英語のページを切り替えする機能が欲しいとき、とっても助かる「Bogo」というプラグインがあります。 これを利用して英語切り替え対応のサイトを作ったので、備忘録を書きます。

ディレクションができないとコード書けたってつらたん

  • 2014.07.25

職業訓練でWEBのお勉強をしたのちに、私がお世話になっている会社は実は制作会社ではありません。制作も、やる会社です。 ITが得意な人だけではないチームで、それぞれの特技が見事に分散しており、いい具合に助け合える素敵な会社です。 私は未経験ながらWEBデザイナーとして雇ってもらえたのですが、少しずつかけるコードも増えてゆき、ホームページが作れるようになりました。 だがしかし。

ほんの少し傾いた写真の角度を一発補正する方法 

写真をみると「あれ、なんだかちょっとナナメな気がする・・・・。」そんなときってありますよね。 ネットショップ用に撮った商品画像でよくそんなことが起こる私です。(瓶ものがななめをむいております) 今回は、私が先日通りすがりにとった風景写真で説明したいと思います。 黄色の線が、写真にまっすぐの線をひいたものです。 写真のまっすぐが出るといいかなぁって思うのは白い線。橋のラインが右下がり気味なので、そこ…

:nth-childでaタグにCSSでボタン実装したいんですが反映されません

ナビゲーションの実装。 こんなタグでナビゲーションを作ってみました。 これを横並びにfloatして背景画像をあてたい! めちゃくちゃ初歩的なことだっただろうと思うのですが、 私はちょっと勘違いしておりハマりましたので、書いておきます。 条件は、liにidなどを付けずに、疑似クラス「:nth-child」を使ってそのナビゲーションを実装するということでした。 :nth-childについては下記のペー…

初めてのサイト制作でしくじっていたこと「id classの乱用」

ホームページをはじめて作った時、とにかく時間がかかりました。 htmlもcssも、まだあまり理解できていなかったから。 で、とにかく確認確認で、書き直し書き直し。 理解していないので、一個一個だめなところをつぶしていく作業が、最初からでした。 それは私の場合成長過程で必要だったとしても、これは避けなきゃいけなかったんじゃないか、と思ったのがこれ。 idの乱用と混乱 今思い返せば、無駄なところにid…