指定したセレクタの箇所までスーッと自動でスクロールするナビゲーションの実装方法

指定したセレクタの箇所までスーッと自動でスクロールするナビゲーションの実装方法

こんにちわ。Webデザイナーのotarieです。

今回は1枚の縦長のサイトなどでナビゲーションのメニューをクリックした際にスーッと気持ちよく指定したセレクタの箇所まで移動してくれる動きの方法をご紹介したいと思います。

まずはメニューを作ります。

こんな感じ。

HTMLの<body>…</body>内にnavのコードを入れます。

この記述の際、大事なのは<!–nav–>直下の<li>の中に入れたメニューそれぞれに名前をつけて行きます。

<a href=”#story“>STORY</a></li> → ※「」を頭につけてね!

 

次に要素内にも指定して行きます。

ここで気をつけたいのが、要素に「id=”story”」という形で指定して行きますが、この指定された部分を先頭にして、その位置まで行ってくれます。なので、変な場所(要素の途中)で指定すると中途半端な部分に行っちゃうので、綺麗に要素をまとめて指定する事をオススメします。私は要素ごとに<section>で囲んでいます。

<section id=”story” class=”story”>

<section>内の「id=””」に指定します。「#」は入れず、大文字、小文字も<nav>で指定したものと同じにしてください。

 

次にjsファイルを作成します。

下記URLアドレスから「http://code.jquery.com/jquery-1.7.1.min.js」の上で右クリック「リンク先を別名で保存」を選択し、目当てのファイルをゲットします。

URL:https://blog.jquery.com/2011/11/21/jquery-1-7-1-released/

ゲットしたら、HTMLファイルの<head>…</head>内に下記コードを貼り付けます。

 

最後に<script>のコードを<head>…</head>内に指定します。

これで完了です!

せっかくのカッコいいサイト。メニューがバッと変わってしまうよりも、スーッと動きのあるスクロールで変わる方が気持ちいいですよね( ´ ▽ ` )

いかがでしたか?

また次回をお楽しみに〜

新アプリをちょい見せ!

どうも たえみんです(・ω・´)
今日は、次回リリースする新アプリの情報をチョイ見せしちゃうよ♡(/ω\)キャッ

もうとっくにリリース出来てるはずなのに、某リンゴ社からリジェクトくらってリリースがなかなか出来ないのはここだけの話だよ( ;∀;)

本邦初公開!(ちょっとだけだよ!)

今回のアプリは今までの、お米とか、猫とか、顔とかとか……ではなく、、、

 

 

ちゃんと!

 

キャラクター(人)を!!!

 

使ったゲームになっています!☆(・д・´)

 

ゲームを作るにあたって、わたくし たえみんが、こんな感じにトップ画面の案を練り練りして……“φ(・ω・。*)カキカキ

 

構図が決まったところで、どんな感じの雰囲気にするのかラフを練り練り……“φ(・ω・。*)カキカキ

さて!どんなイラストに仕上がるかはリリースされてからのお楽しみに!
今回はキャラクターVOICEも入っているとか入っていないとか……!
乞うご期待あれ!( `ー´)ノ

 

こんなキャラも登場したり……( *´艸`)

今までのサプライドアプリとは、一味も、二味も、違う!
皆様是非お楽しみに!☆(・`д・´)シャキーン!

Unity産IOSアプリのサイズダウン!

どうも!su-sanです

今回はUnityでビルドしたIOSアプリのアーキテクチャの設定を使用した簡単なサイズダウンの方法について書きたいと思います。

ItunesConnectにアップロードする際やipaファイルを作成する際

実機でテストしたサイズよりはるかに大きくなってしまうという問題解決の一助となれれば幸いです!

 

まずはUnity側の設定です。下図の通りに設定します。

UnitySetting
Unity Setting

続いてXcode側の設定を下図のarm64(Iphone5s以降のアーキテクチャ)に設定します。

XcodeBuildSetting
XcodeBuildSetting

これだけで劇的にアプリサイズが軽くなります!

自分たちの開発していたアプリではこれを使用することで約80MBの削減に成功しました!

もしこれでErrorが出てしまう際は一度下図のBuildを試したのちArchiveを使用すればエラーは消えるので試して見たらいかがでしょうか

XcodeBuild
XcodeBuild

以上!su-sanでした〜

UniRxでコールバック関数の実装|ω・`)

 
今日はUniRx使ったコールバック関数の使い方だよ|ω・`)
今日使う顔文字はこれだよ|ω・`)|ω・`)

そもそもUnity + reactive extensions(Rx)の略でRx自体いろんな言語で使われてるから覚えて損はないと思う!!!!!!!!٩(๑`^´๑)۶

UniRxはdelegateやらeventと一緒で非同期処理で使ってるよ!!
 
 
まずはインスタンス化|ω・`)
ちなみに今回はイベントが発行されたタイミングを知りたいからUnit型を宣言してるよ!
Subjectに何も渡さないのはエラー出るからダメよ!!!|ω・’)
イベント発行時にstring渡したいならSubject(string)とすればよろし

 
宣言したら次は登録!|ω・`)
delegateでいう「変数 += コールバック関数」のとこやね!
UniRxは基本匿名関数でやってるけどね僕は(ドヤガオ

 
登録したらどこの処理で呼ぶか記述|ω・`)

 
実はこのUnit.Defaultを知るのに数時間Googleをさまよった。。。
どこ見てもだいたいstringやらint入れてたからね。。|ω;`)

UniRxはもっと便利な機能あるけど、大元の基本はこんな感じ!;ω;`)

そろそろ対人戦アプリ作ろうと思うこの頃…

 

新アプリNight Cloudリリースです♪

どうも、たえみんです(^^♪
前回、ブログでもチョロっとご紹介しましたが、弊社の新アプリが出ましたよ~♪

その名も「Night Cloud」

もう皆さんはダウンロードされましたか?
またもや、わたくし たえみんがデザイン面を担当させて頂きましたよ~(^_-)-☆

そして今回のアプリでも またもや噂のアイツが登場します!

コインを貯めて是非是非GETしてみてくださいね(^_-)-☆

このNight Cloudというアプリ、なかなかに難しくこのプログラムを組んだ新人君のスコア225を超せません(T_T)
私もなかなかにいい線いってると思うんだけど・・・
(※ランキングは一週間でリセットされるので現在の1位は私たえみんですが、歴代ハイスコアは新人君の225です)

皆さんどうか、私の代わりに新人S君のスコアを破ってぎゃふんと言わせてやってください(>_<)!!!

 

 

 

*・゜゜・*:.。..。.:*・’*:.。. .。.:*・゜゜・**・゜゜・*:.。..。.:*・’*:.。. .。.:*・゜゜・*
現在続々と新アプリの自社開発をしています!
また近々お披露目できると思うので続報をお待ちください~(^^♪