0

ここにウェブサイトがあります。

ページが読み込まれるとすぐにポップアップ ウィンドウが表示されます。ただし、HTML コンテンツでリンクを利用できません。

ここにHTMLがあります...

<body onload="popup('popUpDiv')">

<div id="blanket" style="display:none"></div>
<div id="popUpDiv" style="display:none">

<a href="#" onclick="popup('popUpDiv')" ><img src="images/x.png" /></a>
        <br />
    <h3 style="color: #FFF; padding-left: 10px;">Updates to the AR Toolbox</h3>
            <br />
                <br />
                <div style="width: 350px; height: 300px; text-align: left;">
                <p style="padding-left: 50px; color: #000;">• Check out the new rotating Announcement Board on the AR Toolbox!</p>
                    <br />
                <p style="padding-left: 50px; color: #000;">• Have you seen the new SUO Tour yet? Click <a href="#" target="_blank">here</a> to check it out!</p>                
                    <br />
                <p style="padding-left: 50px; color: #000;">• South University and The Education Foundation Scholarship Committee are now on SharePoint. Click <a href="#" target="_blank"> here!</a></p>
                    <br />
        </div>
</div>

ポップアップを見ると、すべてのリンクがポップアップ ウィンドウの右上隅に「X」でグループ化されていることがわかります。

ポップアップのCSSは次のとおりです...

#blanket {
   background-color:#111;
   opacity: 0.65;
   filter: alpha(opacity=65)
   *background:none;
   position:absolute;
   z-index: 9001;
   top:0px;
   left:0px;
   width:100%;
}

#popUpDiv {
    position:absolute;
    background-color: #fff;
    background-image:url(../images/popup_bg.png);
    background-repeat:no-repeat;    
    width:400px;
    height:400px;
    border:5px solid #000;
    z-index: 9002;
}


#popUpDiv a {
    background-image: url(../images/x.png); 
    background-repeat: no-repeat;
    position:absolute; top:10px; right:10px}

「#popUpDiv a」セクションにあると思いますが、修正方法がわかりません。

何か案は?

編集:これがjsfiddleです

2 番目の箇条書きには、「クリックしてチェックしてください」と表示されます。「ここをクリックてチェックしてください!」

3 番目の箇条書きには、「ここをクリック」のはずの「クリック」が表示されます。

しかし、繰り返しになりますが、何らかの理由ですべてのリンクが右上隅にまとめられています。

4

1 に答える 1

0

にスタイルを適用する代わりにa、スタイル クラスを作成して、それを に適用しますpopUpDiv。このような...

#popUpDiv .close {
    background-image: url(../images/x.png); 
    background-repeat: no-repeat;
    position:absolute; 
    top:10px; 
    right:10px
}

popup hrefそしてそれを...に適用します

<a href="#" onclick="popup('popUpDiv')" class="close"><img src="images/x.png" /></a>

jsFiddle DEMOはこちら

お役に立てれば!

于 2013-07-10T00:53:38.763 に答える