質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.50%

  • JavaScript

    16439questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • HTML

    8982questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • jQuery

    6713questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • CSS

    5799questions

    CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

  • HTML5

    4022questions

    HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

particleground をプラグイン後、フル画面で背景は宇宙の写真で模様だけを表示させたいのですが、どうしたら良いか詳しい方教えてください

受付中

回答 0

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 707

pun

score 1

リンク内容
プラグインの指示どうりやるとリンクが押せず、違うやり方では背景でしたまで綺麗に見えません。解決方法はないでしょうか?

html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <meta name="description" content="" />
        <meta name="keywords" content="," />
        <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=3" />
        <meta name="msapplication-TileImage" content="./msapplication-TileImage.png" />
        <meta name="msapplication-TileColor" content="#fff" />
        <!--[if IE]><meta http-equiv="Imagetoolbar" content="no" /><![endif]-->
        <title></title>

        <link rel="stylesheet" type="text/css" media="screen and (min-width:1024px)" href="../css/screen_pc.css" />


        <link href='https://fonts.googleapis.com/css?family=Ultra' rel='stylesheet' type='text/css' />
        <link rel="apple-touch-icon" href="./apple-touch-icon.png" />
        <link rel="shortcut icon" type="./image/vnd.microsoft.icon" href="./favicon.ico" />
        <link rel="icon" type="image/vnd.microsoft.icon" href="./favicon.ico" />
        <link href='https://fonts.googleapis.com/css?family=Ultra' rel='stylesheet' type='text/css' />
        <link rel="stylesheet" type="text/css" href="../css/default.css">
        <link rel="stylesheet" type="text/css" href="../css/component.css">

        <script src="../jquery/jquery-1.10.2.min.js"></script>
        <script type="text/javascript" src="../js/global.js"></script>

        <script type="text/javascript" src="../js/jquery.particleground.min.js"></script>

        <script src="../js/jquery.dlmenu.js"></script>
<script type="text/javascript">
$(function(){
    $('.particales').particleground({ //要素の指定
        dotColor:  '#ffffff',    //ドットの色
        lineColor: '#ffffff',        //線の色
        particleRadius: 5            //ドットのサイズ
    });
    $( '#dl-menu' ).dlmenu();
  $("#toggle").click(function(){
    $("#menu").slideToggle();
    return false;
  });
  $(window).resize(function(){
    var win = $(window).width();
    var p =660;
    if(win > p){
      $("#menu").show();
    } else {
      $("#menu").hide();
    }
  });
    var win = $(window).width();
    var p = 660;
    if(win < p)$(function(){
        $("#menu li a").click(function(){
            $("#menu").hide();
        });
    });
});
</script>


        <!--[if lte IE 8]>
        <script type="text/javascript" src="./lib/html5/html5shiv-printshiv.js"></script>
        <script type="text/javascript" src="./lib/html5/css3-mediaqueries.js"></script>
        <link rel="stylesheet" type="text/css" hr<a href = "index.html"></a>ef="./css/ie8.css" media="screen" />
    <![endif]-->


    </head>
    <body>
        <div id="product_area" class="particales">
            <header id="header_area">

                <div id="title_area02">
                <div class="wrap_area">
                    <h1>タイトル </h1>
                </div>
                    <nav id="menu-box" class="clearfix">
<div id="toggle"><a href="#">MENU</a></div>
    <ul id="menu" class="">

                            <li><a href="../about/about.html"/>home</a></li>
                            <li><a href="../about/about.html"/>home</a></li>
                            <li><a href="../about/about.html"/>home</a></li>
                            <li><a href="../about/about.html"/>home</a></li>
                            <li><a href="../about/about.html"/>home</a></li>
                            <li><a href="../about/about.html"/>home</a></li>


    </ul>
</nav>
                    <div id="sub">
                        <h1>テキスト</h1>
                    </div>

                        <div class="image_pic">
                        <img src="../img/in_egg.png" alt="" width="336" height="312"  />
                        </div>    
                    <article class="about_description">
                        <p>hoghogehogeogeogeghoeggeghhoeghoghegehoghegoheghoeg<span>hihfohfefhhefoehffheohe。</span>hogrhogrhoghogghghorghogrgghrghrgghghoghghoghogh</p>
                        </article>


                            <div class="image_pic">
                                <img src="../img/in_egg.png" alt="" width="149" height="143"  />
                            </div>    

                        <article class="about_description">
                            <p>hhohhohhohhohhohohohohohohohoohohohohohohohohoho</p>
                            </article>

                            <article id="about_next_comment">
                                <h1>yテキスト</h1>
                                <p>hohhohohohohohhohohohohohohohohohoohohohoh
                                hoohohohohohoho。</p>
</article>

                            <footer id="footer_area">
                <small>&copy 2017 ALL RIGHTS RESERVED</small>
                </div>
            </footer>


    </body>
</html>

cssは

@media only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (min-resolution:1.5dppx){

}
/* TEMPLATE Retina parts end*/

body, html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

/* INTERFACE */
body{
    -webkit-text-size-adjust:100%;
    background-color:white;
    margin:0px;
    padding:0px;
    font-family:"游明朝", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "MS 明朝", serif;

}

body {
    background-color:none; !important;
}
html,body {
    height: 100%;
}

.wrap {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;

}


/* TEMPLATE +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ Retina parts */  
@media only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (min-resolution:1.5dppx){  

}  
/* TEMPLATE Retina parts end*/  



/* INTERFACE */  
body{  
-webkit-text-size-adjust:100%;  
background-color:white;  
margin:0px;  
padding:0px;  
font-family:"游明朝", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", "MS 明朝", serif;  

}  
#layout_area{  
max-width:1680px;  
background-image:url("../img/main_004.jpg");  
background-repeat:no-repeat;  
background-position:center-top;  
background-size:cover;  
height:100%;  
margin:0 auto;  




}  

#header_area{}  

#logo_area{  
padding:10px 10px;  

}  

#title_area{  
text-align:center;  
margin-top:0px;  




}  

#sub_title_area{  
text-align:center;  
margin-top:-40px;  


}  










#menu {  
width: 100%;  
max-width:1680px;  
margin:0 auto;  
padding:0;  
display:block;  


}  
#menu li{  
display:block;  
float: left;  
width: 16.6666667%;  
margin: 0;  
padding:0;  

}  
#menu li a {  
display: block;  
padding:0 20px 0 20px;  
background-color:;  
color:white;  
text-align: center;  
text-decoration: none;  
border-right:1px solid #4baacb;  

}  
#menu li:last-child a{  
border: none;  
}  
#menu li a:link{  
color:#000;  
}  
#menu li a:hover{  
color:blueviolet;  
}  
#toggle {  
display: none;  
}  

#footer_area{
    max-width:1680px;
    text-align:center;
    border-top:1px solid #ffffff;
    color:#ffffff;
}

}

#footer_area small{
    font-size:12px;
}






.image_pic{
    text-align:center;
}


.about_description{
    width:600px;
    text-align:center;
    margin:80px auto;
}



.about_description p{
    color:#000000;
    text-align:center;
}

.about_description span{
    color:#0000;
}

#about_next_comment{
    width:600px;
    margin:100px auto;


}

#about_next_comment h1{
    text-align:center;
    color:aqua;
}
#about_next_comment p{
    color:#0000;
    text-align:center;
    width:600px;
    display:block;
    margin:0 auto;
}

です。よろしくお願いします

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正の依頼

  • s8_chu

    2017/03/20 08:44 編集

    HTMLが途中で途切れているようですので、追記していただけませんか?また、様々な閉じタグが抜けているため、どのような構造なのかわからないので直して頂けるとうれしいです。

    キャンセル

まだ回答がついていません

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.50%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る

  • JavaScript

    16439questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • HTML

    8982questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • jQuery

    6713questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • CSS

    5799questions

    CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

  • HTML5

    4022questions

    HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

  • トップ
  • JavaScriptに関する質問
  • particleground をプラグイン後、フル画面で背景は宇宙の写真で模様だけを表示させたいのですが、どうしたら良いか詳しい方教えてください