• 締切済み

サイト訪問時に一度だけ表示されるページ

サイト訪問時に一度だけ表示されるページはどう作ればよいですか? できればindex.html内で完結されているほうがいいです。 久しぶりに勉強を兼ねてWEBサイトを作成しています。 作ってる環境はHTML5、CSS3、jQuery等です。 色々検索してみたのですが、わからなかったので質問させていただきます。 文章では伝えづらかったので画像を用意しました。見てください。 なにか方法がありましたらご教授ください。

みんなの回答

回答No.1

相手が初回訪問かどうかを判定するのは、クッキー以外にないでしょう。 jQuery cookieを使えば簡単ですよ。 https://goo.gl/tBvFpG リロード判定というのは、難しそうですが、こんな難しいことも編み出している人が居るんですね。 windowに名前をつける方式で、リロードしたのか、新規訪問なのかを判別する方法を考えついている人が居ます。良く思いつきますよね・・・。 http://samurai20000.hatenablog.com/entry/20091209/1260366464 どちらも、若干Javascriptの知識が必要ですが、サイトを見れば例文が載っているので、それをアレンジすれば比較的簡単かと思いますよ。

noname#225721
質問者

お礼

今なんとなくやってみたら出来ました(∩´∀`)∩ とりあえずindexページのスクリプトに //初回アクセスのみWELCOME表示// var $my_window = "toppage"; // 任意のウィンドウ名を指定 if ( window.name.indexOf( $my_window )!=-1 ) { //任意のウインドウ名かチェック } else { window.name = $my_window; // ウィンドウ名を任意に名付ける alert( "ようこそ!" ); // 初回訪問時の処理 } //リロードでWELCOME表示// function reloaded () { return window.name == window.location.href ? true : false; } if (reloaded()) { window.name = $my_window; // ウィンドウ名を任意に名付ける alert( "ようこそ!" ); // 初回訪問時の処理 } window.name = window.location.href; んで、コンテンツページのスクリプトに var $my_window = "toppage"; // 任意のウィンドウ名を指定 if ( window.name.indexOf( $my_window )!=-1 ) { //任意のウインドウ名かチェック } else { window.name = $my_window; // ウィンドウ名を任意に名付ける } を組み込むことでなんとか希望の動きが出来ました。 半分くらい理解しきれてないんでなんか余計なコードがあるかもしれませんが…とりあえず出来たので満足です。 ありがとうございました!

noname#225721
質問者

補足

回答ありがとうございます。 その後、色々と検索した結果。 http://web.contempo.jp/weblog/tips/p3147 このページに行き当たりましてこれを採用することにしました。 リロードの処理は、コードがややこしくなりそうなのでとりあえずやめました。 ですが、 検索サービスからコンテンツページを最初にみた時、indexに戻るとWelcome画面が出てきてしまうのがやや気になりますね。その場合はいらないというか… やっぱ、別途Welcomeページを作ってそこからメインページに飛ぶという単純な方法がいいのか悩んでます。。。

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • イラレからWEBサイト

    大学の課題でWEBサイトの作成があるため こちらのサイトを参考にイラストレーターからWEBサイトを作ろうと考えました。 https://blogs.adobe.com/creativestation/web-start-illustrator-web-design-06-export-images しかしチュートリアルはこのページの画像のスライスで終わってしまっています。 イラストレータからHTMLやCSSまで書き出すことはできないのでしょうか? 画像のみを作成し、あとは位置などのHTMLやCSSの設定は 自分でコードを書かなければならないのでしょうか? この画像のスライスの後どうしたら良いのか教えていただきたいです!

    • 締切済み
    • CSS
  • HPの2ページ目の作り方

    初めて利用させていただきます、WEB初心者ですがよろしくお願いします。 現在ホームページをホームページビルダーで作成しています。 テンプレートができたのですが次のページの増設をどのように行なうのが良いのか分からずに困っています。 ディレクトリの構成はルートフォルダの下に index.html(まだ、コンテンツは作っておらず、段組の状態です)=cssフォルダ=imageフォルダ=pageフォルダ というように3つのフォルダ+インデックスhtmlで分けています。 各フォルダにはcssとimageが入っていて、現在pageフォルダが空の状態です。 この状態でインデックス(テンプレート)を作り終えたところです。 ページフォルダにテンプレートを使って新しいページを増やしていきたいのですが、 この場合pageフォルダにインデックスhtml(テンプレート)をコピペするとhtmlとcssの画像やリンクのURLを全て書き換えなければならないのでしょうか。 まず、ディレクトリ構成として正しいのか、正しいのであればどのように増設していくのが効率が良いのか、それとも階層が変わるたびに全ての画像やリンクのURLを書き換えてやっていくしかないのか。 どなたか詳しい方、ご教授お願い致します。

    • ベストアンサー
    • CSS
  • FlashからLightboxを使用してウェブページを表示させる方法

    初めて質問させていただきます。 FlashとLightboxについてです。 FlashからLightboxを使って、ウェブページを表示させたいのです。 以下のサイトに画像を表示させる方法は載っているのですが、ウェブページを表示させる方法がわかりません。 http://youmos.com/reference/lightboxflash.html FlashやHTML、CSSの知識は多少あるのですがJavaの知識はあまりないので…。 よろしければご教授の程、よろしくお願いします。

  • jQueryを使ったロールオーバーについて

    初めまして。Webサイト作成の初心者です。 JQueryを使って、フェードエフェクト効果のあるロールオーバーを作成したいと思っております。 例えば次のサイトでは、若干フェードエフェクト効果のあるロールオーバーとなっておりますが、ソースを見るとbody内にはオフマウス用の画像だけが記されております。 http://mizuame.sakura.ne.jp/jquery.tgImageRollover/demo/script2.html オンマウス用の画像への切り替えはCSSで行っているのでしょうか? ちなみに、グローバルメニューなどでは、オフマウス用とオンマウス用の画像を一つにし、CSSで座標を調整することで、ロールオーバーをすることが多いと思いますが、この方法だとJQueryを使ってロールオーバーにフェードエフェクト効果を付けることはできないのでしょうか? それとも、やはりロールオーバーにフェードエフェクト効果を付けるには、オフマウス用の画像とオンマウス用の画像を、それぞれ用意し、オフマウス用の画像はHTMLに記述し、オンマウス用の画像はCSSに記述するのでしょうか? どのような回答でもお受けしたい所存で御座いますので、どうか宜しくお願い致します!!

  • 他社サイトの『ページごとの訪問者数』が知りたいです

    競合他社のWebサイト分析が急務となりました。他社サイトの『ページごとの訪問者数』を知る方法はありますか? 自社グループのWebサイトは、サービスで分かれた子会社ごとに、別ドメインで運用しています。しかし競合他社サイトのなかには、同一ドメイン内でページごとに子会社のサービス紹介を展開しているところがあります。自社グループ子会社と競合他社子会社を同列で比較するためには「競合他社子会社ごと(ページ)の訪問者数」を知る必要があると考えています。そこでAlexaなど無料で解析できるツールを使用してみましたが「サイト(ドメイン)ごとの訪問者数比較」しか得られないとわかりました。有料・無料問わず他社Webサイトのページ訪問者数を知ることができるツールまたはサービスは存在するのでしょうか。私はWebに関する知識はほぼ無いので困ってしまっています。

    • 締切済み
    • SEO
  • 掲示板サイトを作成するのに必要な技術は?

    私は個人的に商用のWebサイトを作成したことがあります。 そこでは、HTML、CSS、PHP、jQueryを使用しました。 次に、掲示板サイトを作成したいと思っているのですが、どのような技術を修得することが必要でしょうか? 例えば大袈裟ですが、2ちゃんねるのような掲示板サイトを作成する場合、どのような技術やシステムが必要でしょうか?

    • ベストアンサー
    • PHP
  • サイト作成でトップページ等に取りかかる時に気をつけることやすべきことは何でしょうか。

    22歳の大学生です。 初めてのサイト作成に取り掛かっているのですが、何からどう手をつけたらよいのかわからず途方にくれています。なるべく早く公開したいのに焦ります。 まずはトップページを作ることに専念すればよいと思うのですが、そのトップページをどんな具合にするかで悩んでいます。サイトマップをトップページに表示させたいとは考えています。 サイトの内容は、趣味の温泉紹介サイトです。(趣味とはいっても、紹介するにあたり一定の基準があり、こだわりがあります) そのために、FOM出版の「よくわかるXHTMLとCSSによるWebサイト作成」という本を読みました。(考えがあってホームページ作成ソフトは、使用しない考えなのです。) この本をもとに作成を始めています。 独自ドメインも取得済みです。 ですが、トップページの設計図もまだ出来ておらず遅々として作業が進みません。どなたかまずはどうしたら良いか助言をお願いします。 トップページの構想が具体的になっていないので、素材などもまだ集めていません。メニューというかコンテンツは、具体的に決めてあります。 なるべく早く作りたいですし、素材は後回しでまずはXHTMLとCSSだけで作れるところまで作ってしまいたいとも考えています。 サイト作成で役立つサイトなども紹介していただければありがたいです。本もFOM出版の「よくわかるXHTMLとCSSによるWebサイト作成」しか持っておりませんので、他に作成上必携の本などありましたら教えてください。

  • クリックするとウインドウ表示

    webサイト製作初心者です。 いろんなところを見ながらHTML・CSSで作成していっています。 今回新しいページを作成するに当たり、 メニューの各ボタンをクリックすると真ん中にウインドウを表示したいと思いました。 どう説明していいのかわからなかったので、画像を添付しました。 画像は上のメニューの「CAST」をクリックした図です。 初期画面・「TOP」を押した際はウインドウは非表示の状態にしたいです。 説明不足で申し訳ありませんが、教えていただけるとうれしいです。 HTML・CSSで作れる方法だとうれしいです。

    • ベストアンサー
    • CSS
  • 訪問回数ごとに違うページを表示させるには

    クッキーを利用して、訪問回数ごとに違うページを表示(ランダムではなく順番に表示)させ、最後のページまで表示させたらまた最初のページから順番に表示させる、この処理をループさせたいのですが、書き方がわかりません。 例えば、表示させたいページがA~C.htmlの3ファイルだった場合、一回目の訪問はA.htmlを表示、2回目の訪問はB.htmlを表示、3回目の訪問はC.htmlの表示、4回目の訪問はまた最初に戻ってA.htmlを表示、5回目の訪問はB.htmlを表示、6回目の訪問はC.htmlを表示、7回目の訪問はまた最初に戻ってA.html・・・というような処理をループさせたいのです。 下記ソースを応用したいのですが、どの部分をどう変更したらよいのか、どなたか教えて頂けませんか?よろしくお願いいたします。 このソースは、訪問回数によってテキストが表示されるというものですが、今回はテキストを表示させるのではなく訪問回数によって用意したページに直接飛ばしたいのです。 <?php header("Content-Type:text/html;charset=Shift_JIS"); ?> <?php $cookie = "repeaters"; // Cookieの名前 $period = time() + 365*24*3600; // Cookieの有効期限(サンプルは1年) if(isset($HTTP_COOKIE_VARS[$cookie])) { $num = (int)$HTTP_COOKIE_VARS[$cookie]; $num++; } else $num = 1; setcookie($cookie, $num, $period); ?> <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <?php if($num == 1) echo "初めての訪問ありがとうございます"; else echo "今回で".$num."回目の訪問になります"; ?> </BODY> </HTML>

    • 締切済み
    • PHP
  • 静的ページと動的ページについてよくわからない

    静的ページと動的ページについてよくわからないのですが HTML+cssで作られたサイトは静的サイト HTML+phpで作られたサイトは動的サイトですか? HTML+ JavaScriptで作られたサイトは どちらでしょうか?

    • ベストアンサー
    • HTML