2017-02-22 11 views
0

元のdivの内側に2つのdivで区切られた背景画像を持つdivがあります。新しいタブで開く2つのdivのクリック可能なリンクを作成するにはどうすればよいですか?divをリンクする方法

私が検索した唯一のアドバイスは、JavaScriptを使用することでしたが、それはすべてのブラウザで動作しませんでしたか?

HTML:

<div class="SocialMedia"> 

    <div class="icon1" onclick="location.href='https://www.facebook.com/DRC.Race.Leathers';" target="_blank" style="cursor:pointer;"></div> 
    <div class="icon2" onclick="location.href='https://twitter.com/DRC_Leathers';" target="_blank" style="cursor:pointer;"></div> 

    <span>Make sure to visit our social media pages to keep up to date with the latest from DRC</span> 

</div> <!-- End of SocialMedia --> 

CSS:

.SocialMedia { 
background-color: #000; 
float: left; 
margin: 10px; 
width: 440px; 
height: 330px; 
background-image: url('Images/Social-Media.png'); 
border: 5px solid #000; 
text-align: center; 
font-size: 10; 
color: #fff; 
position: relative; 
} 

.SocialMedia span { 
position: absolute; 
bottom: 0; 
left: 0; 
right: 0; 
} 

.icon1 { 
width: 180px; 
height: 180px; 
float: left; 
} 

.icon2 { 
width: 180px; 
height: 180px; 
float: right; 
} 
+0

'DIV'を' A'で置き換えますか? –

+0

新しいウィンドウで開くには 'location.href'の代わりに' window.open'を使う必要がありますが、四角形の穴に丸いペグを打ち込み、divをハイパーリンクのように振ることは悪い考えです。それは、障害のあるユーザによるユーザビリティを犠牲にし、ウェブクローラやインデクサなどを止めさせるでしょう。 –

答えて

0

ネヴァーマインド、私は私のエラー実現

HTML:

<div class="SocialMedia"> 

    <a href="https://twitter.com/DRC_Leathers" target="_blank"><div class="icon1"></div></a> 
    <a href="https://twitter.com/DRC_Leathers" target="_blank"><div class="icon2"></div></a> 

    <span>Make sure to visit our social media pages to keep up to date with the latest from DRC</span> 

</div> <!-- End of SocialMedia --> 

CSSは同じ

に宿泊
関連する問題