こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

締切り済みの質問

galleryviewのjavascriptについ

下記の画像の部分にどうしてもリンクを貼りたいのですが上手くいきません。ご教授願います。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>GalleryView - Default Demo</title>

<!-- First, add jQuery (and jQuery UI if using custom easing or animation -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>

<!-- Second, add the Timer and Easing plugins -->
<script type="text/javascript" src="../js/jquery.timers-1.2.js"></script>
<script type="text/javascript" src="../js/jquery.easing.1.3.js"></script>

<!-- Third, add the GalleryView Javascript and CSS files -->
<script type="text/javascript" src="../js/jquery.galleryview-3.0-dev.js"></script>
<link type="text/css" rel="stylesheet" href="../css/jquery.galleryview-3.0-dev.css" />

<!-- Lastly, call the galleryView() function on your unordered list(s) -->
<script type="text/javascript">
$(function(){
$('#myGallery').galleryView();
});
</script>
</head>

<body>
<ul id="myGallery">
<li><a href="http://ariacompany-since2010.com/shop/products/list.php?category_id=47"><img src="http://www.spaceforaname.com/galleryview/img/photos/bp1.jpg" alt="Lone Tree Yellowstone" /></a>
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp2.jpg" alt="Is He Still There?!" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp4.jpg" alt="Noni Nectar For Green Gecko" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp7.jpg" alt="Flight of an Eagle Owl" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp14.jpg" alt="Winter Lollipops" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp26.jpg" alt="Day of Youth" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp27.jpg" alt="Sunbathing Underwater" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp28.jpg" alt="Untitled" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp41.jpg" alt="New Orleans Streetcar" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp49.jpg" alt="By The Wind of Chance" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp52.jpg" alt="Fishing on the Cloud" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp53.jpg" alt="Blue Lagoon" />
<li><img src="http://www.spaceforaname.com/galleryview/img/photos/bp54.jpg" alt="Time" />
</ul>
<p>Please view the source of this page if you are having difficulties setting up GalleryView.</p>
</body>
</html>

投稿日時 - 2012-05-16 01:30:06

QNo.7478142

困ってます

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(2)

ANo.2

プラグインの本家サイトを見てみました。
<ul>に指定した画像リストのhtml部は、実際の表示とは何ら関係なく、単にjavascriptが読み込む画像ファイルリストに使用しているだけのようです。従って、HTMLをどうこうしてもリンクは貼れません。端的に言うと、このプラグインにはそのような機能は想定されていないということです。jQueryのプラグインは、JavaScriptを知らない人でも簡単に扱えるものですが、逆に言うと、提供されている機能以上のことは出来ないと思って問題ないですよ。そこからはjavascriptを書ける人の領域です。質問でヒントを得られるかもしれませんが、根本的なことをご存知でないとすれば、改変するのは難しいでしょう。

投稿日時 - 2012-05-16 12:34:13

お礼

ご回答ありがとうございます。

ヒントでも良いのでなにかご教授いただけませんでしょうか?
大きな画像の部分にリンクを張れるだけで良いので。
すみませんが宜しく御願い致します。

投稿日時 - 2012-05-16 15:19:55

ANo.1

何が問題なのかさっぱりわかりませんが、とりあえずhtmlの文法が間違っています。
xhtmlで書かれているので、すべてのタグは閉じてください。
<ul>に対しては</ul>が必要です、<a>は</a>で閉じる、<li>は</li>で閉じる。明確に分かるのはそれだけです。
何が問題か分からないので、それが原因かどうかもわかりません。

投稿日時 - 2012-05-16 04:03:35

お礼

ご回答いただきありがとうございます。
<li><a href=" "><img src="http://www.spaceforaname.com/galleryview/img/photos/bp1.jpg" alt="Lone Tree Yellowstone" /></a></li>
のように閉じるとAタグが邪魔してサイト上に表示されなくなります。
元々imgしか読み込まないような仕組みなのか、それともaタグの記述の仕方を変更すれば良いのかが分かりません。

投稿日時 - 2012-05-16 11:05:00

あなたにオススメの質問