タグ

ブックマーク / teamsanta.info (6)

  • ナビゲーションの作り方【html・css・nav】|合同会社チームサンタ

    何が言いたいかよくわからん記事を書くより、基を押さえたほうがみんな幸せに。 そんなわけでコーディングの基ナビゲーションの作り方についてです。 横並びのナビゲーションの作り方〜 float 〜 reset.cssやnomalize.cssは各自使用してください。 よく使われているやつ。 <!-- HTML --> <ul class="list-nav00"> <li><a href="">HOME</a></li> <li><a href="">制作実績</a></li> <li><a href="">サービス</a></li> <li><a href="">会社案内</a></li> <li><a href="">ブログ</a></li> <li><a href="">お問い合わせ</a></li> <li><a href="">採用情報</a></li> </ul> ナビゲーション

    ナビゲーションの作り方【html・css・nav】|合同会社チームサンタ
  • 【CSS】要素の内側にborderを|合同会社チームサンタ

    先日夜中に両肩に激痛が走り眠れぬ夜を明かしました。 接骨院行ってエレキバンとか貼ってるうちに治りましたが、 あれはいったいなんだったんでしょうね? さて、今回は最近使ったCSSです。 画像の内側にborderを引く 画像や要素にhoverした時などでborderで囲うようにすることはよくあるかと思います。 その際、要素の外側にborderを表示すると、borderのpx分だけズレが出てしまい、 ソレ以降のレイアウトが崩れて汚くなってしまいます。 そんな時に教えてもらったのがこちら。 デモページ サンプルソース html <body> <ul> <li><a href="#"><img src="img.gif"></a></li> <li><a href="#"><img src="img.gif"></a></li> <li><a href="#"><img src="img.gif">

    【CSS】要素の内側にborderを|合同会社チームサンタ
  • ブログ-Web|合同会社チームサンタ 仙台 ホームページ制作

    仙台のホームページ制作 合同会社チームサンタの社員によるお役立ち情報がいっぱい。webカテゴリー記事一覧。

    ブログ-Web|合同会社チームサンタ 仙台 ホームページ制作
  • 【jQuery】ヘッダーを最上部に固定!|合同会社チームサンタ

    先日USJでハリーポッターのアトラクションがオープンしましたねぇ 私も早く行きたくてフォイフォイしてます。 さて、最近時間を見つけては使いそうなjQueryを集めていましたが、 今回はそんな中から割と使うことの多い「headerを上部に固定」するjQueryをご紹介。 常にheaderを表示させておきたい! 縦に長いページの場合、画面がスクロールしてしまうとheader部分が隠れてしまい スクロールバーや「TOPへ戻る」のボタンで一度一番上まで戻る・・・なんて事が あるかと思います。(まぁ大体footerにもメニューがありますが) そんな時、常に最上部にheaderがあればサクッとページ遷移できますね。 サンプルソース ってことで、まずはjQuery部分から。 あらかじめjQuery体は読み込ませておいてください。 <script src="//ajax.googleapis.com/a

    【jQuery】ヘッダーを最上部に固定!|合同会社チームサンタ
    masakaz77
    masakaz77 2014/09/02
  • 【ポリゴン】流行のテクスチャをサクッと作成!【スタイル】|合同会社チームサンタ

    どうも熊谷です [▓▓]=͟͟͞͞=͟͟͞͞ εː) 最近29歳になりましたありがとうございます。 今年中にカッコイイ大人になれるよう努力して行きたいです。 さて、今回は巷ではよく見られるようになったポリゴンスタイルテクスチャをサクッと作れる「Flat Surface Shader」というサービスを簡単にご紹介したいと思います。 ポリゴンスタイルを簡単作成 http://matthew.wagerfield.com/flat-surface-shader/ 早速上記URLへアクセスしてみましょう! サイトではすでに生成されたポリゴンが動いていると思います。 画面右側にメニューがありますので、色や形を変化することが可能です。 お好みで調整したら最後にExportを押すことで静止画として生成することが出来ます。 ね、簡単でしょ! まとめ ポリゴンスタイルは最近結構見るようになってきましたが、1

    【ポリゴン】流行のテクスチャをサクッと作成!【スタイル】|合同会社チームサンタ
    masakaz77
    masakaz77 2014/09/02
  • 【jQuery】要素を全画面表示してからスクロール|合同会社チームサンタ

    jQueryはもうweb制作にはなくてはならないものになりましたね。 web上にも情報がたくさん載っているので、グーグル先生に聞けば大抵のことはすぐに分かります。 そのなかで個人的に結構使うんだけど、あまり紹介している記事とかないよなと思ったものをご紹介出来ればと思います。 チームサンタの三浦です。 フルスクリーンからのスクロール デモページ ちょっと上手く動きの説明が出来ないのでまずはデモページで確認して下さい。 背景画像などを画面サイズいっぱいに広げてから、セクションを切り替えてスクロールさせたい!もちろんリサイズしても大丈夫! ってこと結構あると思うのですけど、意外に情報が少ないと感じたので、紹介出来ればと思い、今回の記事を書かせてもらいます。 HTML <body> <section id="s01"> <h1>全画面表示させたいセクション</h1> </section> <sec

  • 1