<!DOCTYPE html>
<html>
<head>
<title>5</title>
<link rel="stylesheet" href="4.css">
<link rel="stylesheet" href="bootstrap.css">
<script src="jquery-3.6.0.js"></script>
</head>
<body>
<a href="1.html">1</a>
<a href="2.html">2</a>
<a href="3.html">3</a>
<a href="5.html">5</a>
<hr>
<h1 onclick="merhabasoyle();">5</h1>
<div class="row">
<div class="col-md-3">
<img id="img1"
class="margin1-img"
src="F1.jpg">
</div>
<div class="col-md-3">
<img id="img2"
class="margin1-img"
src="F2.jpg"/>
</div>
<div class="col-md-3">
<img id="img3"
class="margin1-img"
src="F3.jpg"/>
</div>
<div class="col-md-3">
<img id="img4"
class="margin1-img"
src="F4.jpg"/>
</div>
</div>
<div class="row">
<div class="col-md-12">
<img id="buyukFoto"
class="mardin2-img"
src="F1.jpg"/>
</div>
</div>
</div>
</body>
<script type="text/javascript">
function merhabasoyle(){
alert('merhaba 2');
};
$(".margin1-img").click(function(){
$("#buyukFoto").attr('src',
$(this).attr('src'));
});
var counter = 1;
$("#img"+counter).click();
$("forward").click(function (){
counter = counter + 1;
if (counter > 4) {
counter = 1;
}
$("#img"+counter).click();
});
</script>
</html>
التعليقات