※ ChatGPTを利用し、要約された質問です(原文:CrossSlideが起動しません。)
CrossSlideが起動しない原因と対処法
こんばんは、よろしくお願いします。
現在制作中のサイトのトップページにCrossSlideを設置しましたが、「Loading... 」の文字のみが表示され、CrossSlideが起動しません。
javascriptが全くわからず、以前、会社の先輩が他のサイトで使用したソースをそのまま使用しています。お手数ですが、原因のわかる方、教えていただけませんでしょうか。
○ソース○
【head】
<!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" />
<link rel="stylesheet" type="text/css" href="stylesheet/style.css"/>
<link rel="stylesheet" href="stylesheet/thickbox.css" type="text/css" media="screen" />
<title>☆☆☆☆</title>
<script src="javascript/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="javascript/jquery.cross-slide.js" type="text/javascript" charset="utf-8"></script>
</head>
【body】
<body style="background-color:#FEF8E8;">
<script type='text/javascript' id='visualArea'>//<![CDATA[
$(function() {
$('#visualArea').crossSlide({
speed: 45, //px/sec
fade: 1 //sec
}, [
{ src: 'move/move_1.jpg', dir: 'up' },
{ src: 'move/move_1.jpg', dir: 'down' },
{ src: 'move/move_1.jpg', dir: 'up' },
{ src: 'move/move_1.jpg', dir: 'down' },
{ src: 'move/move_1.jpg', dir: 'up' },
{ src: 'move/move_1.jpg', dir: 'down' },
{ src: 'move/move_1.jpg', dir: 'up' }
]);
});
//]]></script>
<div id="visualArea"> Loading...</div>
お礼
本当にありがとうございました! とても勉強になりました。 他のライブラリーを使うことも考えてみたいと思います。 お手数おかけしました。