【怖くないJavaScript + jQuery】コンテンツの高さを自動で調整してくれるjs
ウィンドウの高さに対して、コンテンツの内容が少ない場合、footerより下の部分が真っ白になってしまう…しかし邪魔だしfooterをfixedにはしたくない。そんな時ってありますよね。 Sticky footerなど他にも手はありますが、内容が動的の場合使えなかったりするんですよね。 そんな時に便利な、コンテンツの高さを自動調整してくれるjsを作ってみましょう。実はとっても簡単なんです。 コンテンツ部以外（headerとfooterなど）の高さが固定であることが条 […]
【怖くないJavaScript + jQuery】クリックで要素を追加・削除する
今日は要素の追加・削除のパターンをご紹介します。 分かりやすいものだけ集めてみました。今回のデモファイルはこちら。 prepend：要素の内部の先頭に追加（子要素） ▼クリックでspanが追加 prepend p 「prepend()」は要素の内部の先頭に()内のタグを追加します。記述はこんなかんじ。 【HTML】 今回はbtn_demoAをクリックした時で処理しています。 demoAとidをつけたdivにpタグを入れ子にしています。idやタグはjsに合わせていれば自由に書き […]
IEで使おうと思ったら使えなかったCSSプロパティーやセレクタ
なるべくcssで表現したいなと思うのですが、そういえばIEで使えないんだった…となることがよくあります。 良く使うものでたまに引っかかるCSSプロパティー・セレクタをまとめてみました。 CSSプロパティー border-radius IE8以下で× 指定した要素の角を丸くするプロパティーです。 box-shadow IE8以下で× 指定した要素のまわりにシャドウをつける事ができるプロパティーです。 text-shadow IE9以下で× テキストにシャドウをつける事ができるプ […]
よくお世話になるjQueryプラグインまとめ2
こんにちは。 今回は前回紹介しきれなかったjQueryプラグインについて続きを書きたいと思います。 相変わらずご紹介程度なので気になったものは検索してみてください！ smart-crossfade.js マウスオーバーした際にすぐに切り替えるのではなく、ふわっとフェードイン・アウトしながら切り替えてくれるjsです。 ぱっと切り替わるのもいいのですが、フェードで切り替わるものサイトに雰囲気がでますよね。 個人的に知っている中で一番簡単だったのでご紹介させていただきます。 マウス […]
【怖くないJavaScript + jQuery】「ページの先頭へ戻る」をスクロールで表示非表示を切り替え
おはようございます。今日もjQueryのことについて書いていきましょうね。 今日のは少し簡単です。 デモ ▲ 実は今回のデモは画面右下に表示されています。いわゆる「ページの先頭にもどる」ボタンですね。 ファーストビューでは表示されておらず、画面の下へ下へスクロールすると表示されます。反対に上に上にスクロールすると、また消えます。 デモのファイルはこちらからダウンロードできます。 Step1：まず下準備 こちらはいつもと同じです。まず必要なファイルを読み込みます。 header […]
【怖くないJavaScript + jQuery】ドラッグで要素を移動させる
おはようございます。今日もjQueryについて書いていこうと思います。 今回はjQueryに加えて、新たにもう一つ「jQuery UI」を使用します。これを使用できるようになるとできることもグンと幅広くなりますね。やってみると読み込むだけで結構簡単なのでぜひ一度試してみてください。 デモ ドラッグで好きな場所に 動かせます。 ↑こちらのボックス、ドラッグで好きな場所に動かすことができます。ちょっといじってみてください。 デモのファイルはこちらからダウンロードできます。 手順1 […]
画像をCSSで縮小した際の各ブラウザの表示
こんにちは、工藤です。 年明け早々寒いですね。 危うく早速風邪をこじらせてしまうところでした。 3連休は暖かくして過ごそうと思います！
【怖くないJavaScript + jQuery】要素をエンドレスでスライドさせる
あけましておめでとうございます。年の瀬の頃より毎日寒いですが、皆様いかがお過ごしでしょうか。 私の今回のブログ初めですが、jQueryのことについて書きたいと思います。 以前「連続した処理で画像をスライドさせる」ことで記事にしましたが、今回はこちらの応用編です。前回は画像を背景に設定し動かしていたのでリンクが貼れませんでしたが、今回はリンクつきの処理を作りたいと思います。TOPページで商品をずらっと並べたい場合などにご使用ください。 デモ デモのファイルはこちらからダウンロー […]
【怖くないJavaScript + jQuery】スクロールの高さを判定して画像をふわっと表示する・シュッと表示する
先日、弊社サービス「proG（プログ）」の、総合病院向けパッケージ「proG hospital」がリリースされました。（プレスリリースも出しています！） リリースにあたってランディングページを制作したのですが、今回は画像がふわっと表示されたりシュッとスライドで表示されたり、アニメーションを多く取り入れています。 参考にと他サイトを色々と見ていたのですが、印象に残りやすく、とても良い仕組みだと思います。 そこで今回は、画面をスクロールし、一定の高さまで届くとアニメーションするj […]
【怖くないJavaScript + jQuery】連続した処理で画像をスライドさせる
おはようございます。本日の渋谷は酉の市があるようで、朝から賑やかです。宮益坂には出店がたくさん並んでいます。 さて、本日の本題ですが、今日はjQueryで「連続した処理」について書こうと思います。画像をスライドさせる時なんかに使えますね。 スマフォやタブレットの普及で、Flashが敬遠されがちなので、最近はjsでのスライドショーのご依頼も増えています。 合言葉は「jQuery こわくない」です。 デモ 今回作るのはこちら。延々と動かすだけなので難しい処理も必要なく、とっても簡 […]
Webサービス開発におけるトレースログの大切さ
Webサービスを開発する際にきちんとトレースログ(操作ログ)は取っていますでしょうか？ Windowsアプリケーションの開発などではトレースログを取るのは常識ですが、実際に今までWebシステムなどに関わってきて、トレースログをきちんと取っているサービスやシステムは正直少ないように思います。 (取る慣習があまりないようにも感じます。) もちろん取っているところ、サーバ容量の問題などでわざと取っていないところもあるでしょう。 不特定多数のユーザーが利用するサービスの場合、不具合が […]
【Androidアプリ】デザイナーがレイアウトする際に覚えておきたいこと
先日、弊社サービスの「ノミトモ」のAndroidアプリがリリースされました。今回もデザインをお手伝いさせて頂いたのですが、普段触っているHTMLと違うことだらけ。調べながらの作業となりました。 実際デザイナーさんが触るのはレイアウトのXMLまでだと思いますが、今後新しくアプリを作り始める方に覚えておいて欲しいことを書いておこうと思います。 eclipseの画面・レイアウトの仕方 こちらがAndroidアプリを作る際に必須のeclipsの画面。（※クリックで拡大します） 解説を […]
【怖くないJavaScript + jQuery】”画像が切り替わるだけ”のシンプルスライドショー
最近jqueryを使ってjsを書くことがずいぶんと増えてきました。やはり皆さんおっしゃるのが「FlashだとiPhoneで見れないのでjavascriptで」という。 そこでプラグインなど調べていて思ったのですが、画像を切り替えるだけのスライドショーのプラグインってあんまり無いんですよね。それならばいっそ書いてしまいましょう。 やってみると結構、簡単ですよ。 制作の準備 まずはjQueryを読み込む 先に下準備を。headerの中に、jQueryと、自分で作ったjavascr […]
プログラム覚えることを挫折しないために
仕事でプログラミングをしていると、「自分にも出来るかな？」「俺もやってみようかな？」と聞かれることがよくあります。 そういう時、私は「出来るんじゃない？」と必ず答えます。 勉強すれば出来るから嘘ではありません。 でも挫折する方が多いです。参考書を購入してちょこちょこと読んでそれで終わってしまう。 挫折した理由を聞くとたいてい 「どこから勉強してよいか分からない。」 「覚えることが多すぎてとっつきにくい。」 など、実際に作るところまでいっていない、または手を動かしていないようで […]
【怖くないJavaScript + jQuery】実際にちょっと書いてみればきっと怖くない。
おはようございます。渋谷にはまだ月曜日の雪が残っています。 東京で雪が降ることは滅多にないので珍しいですね。皆様如何お過ごしでしょうか。 私はというもの、連休の中日の日曜日にサバゲーに誘われはるばる千葉まで行って参りました。 初サバゲーだったのですが、もうすごいですね、ドキドキして楽しかったです。まだ両足が筋肉痛です。 こんな中を物陰に隠れながら銃持って撃ち合い… jQueryで要素を取得 さて、本日の本題です。前回はタブ前々回はアコーディオンと書いてきましたが、 今回はつい […]
【怖くないJavaScript + jQuery】シンプルなタブ
先日「【怖くないJavaScript + jQuery】シンプルなアコーディオン」という記事を書いたのですが、今回はその続編でタブについてです。 ほんとにタブの機能だけで良い時。たとえばメッセージのページを作っていて、受信トレイと送信トレイのふたつのタブだけで良いのよ、っていう時。 余計な機能がいらない時に使ってください。 合言葉は「jQuery コワクナイ」です。 Step1：まず下準備 こちらは前回と同じですね。まず必要なファイルを読み込みます。 headerの中に、jQ […]
【怖くないJavaScript + jQuery】シンプルなアコーディオン
javascriptのソースがガリガリ書けない身としては、jQueryと一緒に入れるだけのライブラリ達は非常に重宝しますよね。プログラマさん達には頭が上がらないです。 ただ、ものによっては痒い所に手が届かないと言いますか、「この機能だけでいいのになー」と思うことが結構あると思います。 今回は「jQuery コワクナイ」を合言葉に、ちょっと記事にしてみたいと思います。本当に簡単なものなら超初心者級の自分でも書けたのできっと大丈夫。 自分で作れれば、無駄なCSSやらも読み込まなく […]
テスターからプログラマーへバグを報告する時に気を使いたいこと。
私自身プログラミングをやっていますが、バグ報告って自分がする分には楽しいのですが、報告されたときには自分のミスなのに腹が立ったなんてことはないでしょうか？ (プログラマーなら思い当たる節はあるはずです。) 自分のミスは棚に挙げて「バグ内容が分かりにくい！」などとテスターのことを責めてしてしまうことも時にはあると思います。 テストする立場からすると「じゃあ、ちゃんと動くように作ってよ！」となります。 テスト段階ではプログラマーも納品またはリリースを控えてピリピリしていますし、テ […]
プログラミングの苦労の割には使ってみると地味な処理
最近社内で制作を進めている時に、「プログラム作るのに時間がかかる割にはこの機能ってそれほど多くの人も使わないだろうし、地味だよね！」という話をしていたのを思いだしたので、今回は処理を作るのに時間がかかる割には使ってみると地味というか、割と何の感慨も抱かない処理を挙げてみました。 いずれも必須な処理なのですが、何気なく使っている割に作る苦労があったりする処理です。 色々なシステムを作っていれば流用していくのでそれほど苦労はないかも知れないのですが、新規で作るとそこそこ苦労すると […]
技術的に出来ないことを納得してもらうためのポイント
Webサイト制作やWebサービスの開発をやっていると、プログラムやHTMLコーディングで、どうしても実現できないことが発生する場合があります。 予め調べていたのに、いざ実際に開発に入ってみたら思いもしないところで影響が出て、仕様通りの動きが出来ない。などなど。 そんな時、ただ単に「出来ません！」と言い放ってしまうのでは、大人気ではありませんし、制作自体もあんまり良い方向で進められなくなってしまいます。 でも、依頼者に技術的なことを説明しても理解してもらえない、、どうしたら良い […]
なかなか難しい紳士なエンジニアの作法。
プログラム開発をやっていて時間がある時の仕様変更は建設的に考えられるけど、立て込んでいる時に言われると頭に来たりすることないでしょうか？ 私はよくあります！ すごく忙しい時に言われると何の仕事でも「今その話しないで！」となる時があります。 どうしても手を動かしているとそうなります。 （まあ、タイミング読まないで話す方も話す方なんですが。。） プログラムって人を怒りやすかったり短気にさせるんでしょうか。 でも時間が経つと大人気ない言い方しちゃったなあ、、なんて思うんです。 エン […]
仕事中のエンジニアはなぜ無愛想なのか。
こんにちは。株式会社8bitの高本です。 先日、ちょっとした会話の中で「どうしてエンジニアの人ってあんなに偏屈な人が多いんだ？！」という話しをされました。 偏屈といえば偏屈ですが、ディレクターの方と話していると無愛想に感じることが多いようです。 私自身、肩書はディレクターであったりしますが、ディレクション作業や事務作業している以外はエンジニア(プログラマー)としてプログラミング作業していることが多いです。 言われてみると自分のことでもあり、ずっと頭の中で渦巻いていたので、この […]
他人のソースコードが読みにくい理由
こんにちは。株式会社8bit 高本です。 最近プログラムばかり作っているので今回はプログラムについて書いてみます。 デザインに関してはこのデザインすごく好き！などデザイナー同士でリスペクトしあっているのを見かけますが、不思議なもので「あいつの書くソースコードが読みやすくてメンテナンスがしやすい！」と褒めているプログラマーをあまり見たことありません。 （もし、いらっしゃったらすいません。単純に強いて褒めないだけなのかもしれませんが、、） 仕事としてプログラムをやっていると、他の […]
プログラムでよくやるおっちょこちょいミス集[PHP編]
こんにちは、株式会社8bitの高本です。 最近はプログラミングしかしていないので、今回はプログラムについて書きます。 プログラムを作ってデバッグしていると、どんな熟練の方でもケアレスミスはするかと思います。 リリースされるときにはそれはすべて解消されているので分かりませんが、作っている段階では誰もがおっちょこちょいミスをしていると思います。 そこで、自分も含めて社内でもよくあるおっちょこちょこミスを列挙してみました。 ブラウザで500エラーとか表示されてしまうと、どこが悪いの […]
エンジニアが開発に行き詰った時にやってみると良いこと。
こんにちは。株式会社8bitの高本です。 ここ最近ずっとプログラムを作り続けています。 やっぱり作って動かすのは面白いですね。 プログラムを作っていると、ロジックを考えていて行き詰ることは結構あると思います。 開発はやってみないとわからない部分も結構あり、開発前にスケジューリングしても、実際にやってみたら技術的に躓いたりして、進捗が遅れたり、なかなか思い通りにいかないこともあります。 (エンジニアが多めに工数を出すのはこういう不測の事態へのリスクヘッジなのです。) 焦ると逆に […]
運営会社:株式会社8bit
制作サービス
運営サービス
