0

jqueryを介してブラウザで伸縮およびスクロールする背景画像を生成するサイトがあります。アイデアは、ページが読み込まれたときに、ユーザーが画像のどこかをクリックするだけで、サイトに移動することです。

ボディの周りに<a>タグがありますが、いくつかの問題があります。

*ほとんどのブラウザでは、マウスによるリンクであることを確認するプロンプトは表示されません

* iPhone では動作しますが、Android ではまったくリンクしません。

これを達成するための最良の、最もクロスブラウザ/モバイル効率の良い方法は何ですか?

<!DOCTYPE html>
<html lang="en">
<head>
    <title>THE BROADHURST</title>
    <meta charset="utf-8">
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <link rel="stylesheet" href="/styles/css/thebroadhurst.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="/styles/css/jquery.vegas.css" type="text/css" media="screen" />

    <script type="text/javascript" src="/jquery/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="/jquery/jquery.vegas.js"></script>
    <script>
    $( function() {
      $.vegas({
        src:'/styles/images/bh_rotate/bhR_<?php echo rand(1,31); ?>.png'
      });
    });
    </script>
</head>
<a href="/home.php">
<body>
    <div class="structure_main clearfix">
    </div>
</body>
</a>

前もって感謝します。

4

2 に答える 2

1

これを行う「最良の」方法が何であるかはわかりませんが、ボディ全体をリンクにするのではなく、ボディをクリックしたときに JavaScript を使用してユーザーをリダイレクトすることができるかもしれません。次のようなもの：

<body onclick="window.location = 'somewhere over the rainbow'">

... または後でイベントに添付します。

​$(function() {
    $('body').click(function() {
        window.location = 'somewhere over the rainbow';
    });
});​​​​​​​​​​​​​

これは Web セマンティクスを壊しますが、少なくともマークアップは有効になります。本文の上にカーソルを置いたときにカーソルを表示したい場合は<a>、次の CSS を追加するだけです。

body { cursor: pointer; }
于 2012-07-13T19:48:41.460 に答える
0

私の友人は HTML が無効なので、動作していないことに驚かない

私が考えることができる最も近いものは、ボディタグの後にアンカーを配置し、ボディタグの終了前に終了するブロックリンクですが、それは少し...極端に思えます

于 2012-07-13T19:29:36.250 に答える