HTMLは同じコードのはずなのに2つ目のページのjQueryが動いてくれません。
キャッシュクリアは試しました。
コンソールにはload resource: net::ERR_FILE_NOT_FOUNDと書いてあります。
前にも出たことがあって自力で解決したのですが、今回同じことをしても駄目でした。
jQueryのコードはコピペです。
見にくいかもしれないですが、何が悪いのか教えていただきたいです…
よろしくお願いいたします。
1つ目のページ(jQueryが動く方)↓
HTML
1 <head> 2 <meta charset="utf-8"> 3 <meta name="viewport" content="width=device-width,initial-scale=1"> 4 <title>title</title> 5 <link rel="stylesheet" href="001練習.css"> 6 <script type="text/javascript" src="jquery-3.5.1.min.js"></script> 7 <script src="001練習.js"></script> 8 </head>
javascript
1$(function(){ 2// 設定 3var $width =640; // 横幅 4var $height =300; // 高さ 5var $interval = 3000; // 切り替わりの間隔(ミリ秒) 6var $fade_speed = 1000; // フェード処理の早さ(ミリ秒) 7$("#slide ul li").css({"position":"relative","overflow":"hidden","width":$width,"height":$height}); 8$("#slide ul li").hide().css({"position":"absolute","top":0,"left":0}); 9$("#slide ul li:first").addClass("active").show(); 10setInterval(function(){ 11var $active = $("#slide ul li.active"); 12var $next = $active.next("li").length?$active.next("li"):$("#slide ul li:first"); 13$active.fadeOut($fade_speed).removeClass("active"); 14$next.fadeIn($fade_speed).addClass("active"); 15},$interval); 16});
2つ目のページ(jQueryが動かない方)↓
HTML
1<!DOCTYPE html> 2<html lang="en" dir="ltr"> 3 4 <head> 5 <meta charset="utf-8"> 6 <meta name="viewport" content="width=device-width,initial-scale=1"> 7 <title>title</title> 8 <link rel="stylesheet" href="002練習.css"> 9 <script type="text/javascript" src="jquery-3.5.1.min.js"></script> 10 <script src="002練習.js"></script> 11 </head>
javascript
1$(window).scroll(function (){ 2 $('.fadein').each(function(){ 3 var elemPos = $(this).offset().top, 4 scroll = $(window).scrollTop(), 5 windowHeight = $(window).height(); 6 if (scroll > elemPos - windowHeight + 100){ 7 $(this).addClass('scrollin'); 8 } 9 }); 10 }); 11
あなたの回答
tips
プレビュー