usimsek/search.html

## search.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sayfa İçi Arama</title>
</head>
<body>
<h1>Sayfa İçi Arama</h1>
<input type="text" id="searchInput" placeholder="Aramak istediğiniz kelimeyi girin">
<button onclick="searchText()">Ara</button>
<button onclick="scrollToNext()">Aşağı</button>
<button onclick="scrollToPrev()">Yukarı</button>
<p id="result"></p>
<div id="section3">
					<h2>Section Three</h2>
					<p>Integer pulvinar leo id risus pellentesque vestibulum. Sed diam libero, sodales eget sapien vel, porttitor bibendum enim. Donec sed nibh vitae lorem porttitor blandit in nec ante. Pellentesque vitae metus ipsum. Phasellus sed nunc ac sem malesuada condimentum. Etiam in aliquam lectus. Nam vel sapien diam. Donec pharetra id arcu eget blandit. Proin imperdiet mattis augue in porttitor. Quisque tempus enim id lobortis feugiat. Suspendisse tincidunt risus quis dolor fringilla blandit. Ut sed sapien at purus lacinia porttitor. Nullam iaculis, felis a pretium ornare, dolor nisl semper tortor, vel sagittis lacus est consequat eros. Sed id pretium nisl. Curabitur dolor nisl, laoreet vitae aliquam id, tincidunt sit amet mauris.</p>
					<p>Phasellus vitae suscipit justo. Mauris pharetra feugiat ante id lacinia. Etiam faucibus mauris id tempor egestas. Duis luctus turpis at accumsan tincidunt. Phasellus risus risus, volutpat vel tellus ac, tincidunt fringilla massa. Etiam hendrerit dolor eget ante rutrum adipiscing. Cras interdum ipsum mattis, tempus mauris vel, semper ipsum. Duis sed dolor ut enim lobortis pellentesque ultricies ac ligula. Pellentesque convallis elit nisi, id vulputate ipsum ullamcorper ut. Cras ac pulvinar purus, ac viverra est. Suspendisse potenti. Integer pellentesque neque et elementum tempus. Curabitur bibendum in ligula ut rhoncus.</p>
					<p>Quisque pharetra velit id velit iaculis pretium. Nullam a justo sed ligula porta semper eu quis enim. Pellentesque pellentesque, metus at facilisis hendrerit, lectus velit facilisis leo, quis volutpat turpis arcu quis enim. Nulla viverra lorem elementum interdum ultricies. Suspendisse accumsan quam nec ante mollis tempus. Morbi vel accumsan diam, eget convallis tellus. Suspendisse potenti.</p>
					<p>Integer pulvinar leo id risus pellentesque vestibulum. Sed diam libero, sodales eget sapien vel, porttitor bibendum enim. Donec sed nibh vitae lorem porttitor blandit in nec ante. Pellentesque vitae metus ipsum. Phasellus sed nunc ac sem malesuada condimentum. Etiam in aliquam lectus. Nam vel sapien diam. Donec pharetra id arcu eget blandit. Proin imperdiet mattis augue in porttitor. Quisque tempus enim id lobortis feugiat. Suspendisse tincidunt risus quis dolor fringilla blandit. Ut sed sapien at purus lacinia porttitor. Nullam iaculis, felis a pretium ornare, dolor nisl semper tortor, vel sagittis lacus est consequat eros. Sed id pretium nisl. Curabitur dolor nisl, laoreet vitae aliquam id.</p>
					<p>Phasellus vitae suscipit justo. Mauris pharetra feugiat ante id lacinia. Etiam faucibus mauris id tempor egestas. Duis luctus turpis at accumsan tincidunt. Phasellus risus risus, volutpat vel tellus ac, tincidunt fringilla massa. Etiam hendrerit dolor eget ante rutrum adipiscing. Cras interdum ipsum mattis, tempus mauris vel, semper ipsum. Duis sed dolor ut enim lobortis pellentesque ultricies ac ligula. Pellentesque convallis elit nisi, id vulputate ipsum ullamcorper ut. Cras ac pulvinar purus, ac viverra est. Suspendisse potenti. Integer pellentesque neque et elementum tempus. Curabitur bibendum in ligula ut rhoncus.</p>
					<p>Disque pharetra velit id velit iaculis pretium. Nullam a justo sed ligula porta semper eu quis enim. Pellentesque pellentesque, metus at facilisis hendrerit, lectus velit facilisis leo, quis volutpat turpis arcu quis enim. Nulla viverra lorem elementum interdum ultricies. Suspendisse accumsan quam nec ante mollis tempus. Morbi vel accumsan diam, eget convallis tellus. Suspendisse potenti.</p>
				</div>
<script>
let foundParagraphs = [];
let currentFoundIndex = 0;

function searchText() {
    let searchText = document.getElementById('searchInput').value.toLowerCase();
    let paragraphs = document.getElementsByTagName('p');
    foundParagraphs = [];

    for (let i = 0; i < paragraphs.length; i++) {
        let paragraphText = paragraphs[i].textContent.toLowerCase();
        let index = paragraphText.indexOf(searchText);
        if (index !== -1) {
            paragraphs[i].innerHTML = paragraphText.substring(0, index) +
                                      '<span style="background-color: red;">' +
                                      paragraphText.substring(index, index + searchText.length) +
                                      '</span>' +
                                      paragraphText.substring(index + searchText.length);
            paragraphs[i].style.backgroundColor = 'yellow';
            foundParagraphs.push(paragraphs[i]);
        } else {
            paragraphs[i].style.backgroundColor = '';
        }
    }

    currentFoundIndex = 0;
    updateResultElement();
}

function scrollToNext() {
    if (foundParagraphs.length === 0) return;

    currentFoundIndex++;
    if (currentFoundIndex >= foundParagraphs.length) {
        currentFoundIndex = 0;
    }
    scrollToElement(foundParagraphs[currentFoundIndex]);
}

function scrollToPrev() {
    if (foundParagraphs.length === 0) return;

    currentFoundIndex--;
    if (currentFoundIndex < 0) {
        currentFoundIndex = foundParagraphs.length - 1;
    }
    scrollToElement(foundParagraphs[currentFoundIndex]);
}

function scrollToElement(element) {
    element.scrollIntoView({behavior: "smooth", block: "start", inline: "nearest"});
}

function updateResultElement() {
    let resultElement = document.getElementById('result');
    if (foundParagraphs.length > 0) {
        resultElement.textContent = 'Aranan metin bulundu.';
    } else {
        resultElement.textContent = 'Aranan metin bulunamadı.';
    }
}

</script>
</body>
</html>

## searchWindow.html
//sayfanın genelinde aramak için

<script>
function searchText() {
    var searchText = document.getElementById('searchInput').value;
    var found = window.find(searchText);

    var resultElement = document.getElementById('result');
    if (found) {
        resultElement.textContent = 'Aranan metin bulundu.';
    } else {
        resultElement.textContent = 'Aranan metin bulunamadı.';
    }
}
</script>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Sayfa İçi Arama</title>
	</head>
	<body>
	<h1>Sayfa İçi Arama</h1>
	<input type="text" id="searchInput" placeholder="Aramak istediğiniz kelimeyi girin">
	<button onclick="searchText()">Ara</button>
	<button onclick="scrollToNext()">Aşağı</button>
	<button onclick="scrollToPrev()">Yukarı</button>
	<p id="result"></p>
	<div id="section3">
	<h2>Section Three</h2>
	<p>Integer pulvinar leo id risus pellentesque vestibulum. Sed diam libero, sodales eget sapien vel, porttitor bibendum enim. Donec sed nibh vitae lorem porttitor blandit in nec ante. Pellentesque vitae metus ipsum. Phasellus sed nunc ac sem malesuada condimentum. Etiam in aliquam lectus. Nam vel sapien diam. Donec pharetra id arcu eget blandit. Proin imperdiet mattis augue in porttitor. Quisque tempus enim id lobortis feugiat. Suspendisse tincidunt risus quis dolor fringilla blandit. Ut sed sapien at purus lacinia porttitor. Nullam iaculis, felis a pretium ornare, dolor nisl semper tortor, vel sagittis lacus est consequat eros. Sed id pretium nisl. Curabitur dolor nisl, laoreet vitae aliquam id, tincidunt sit amet mauris.</p>
	<p>Phasellus vitae suscipit justo. Mauris pharetra feugiat ante id lacinia. Etiam faucibus mauris id tempor egestas. Duis luctus turpis at accumsan tincidunt. Phasellus risus risus, volutpat vel tellus ac, tincidunt fringilla massa. Etiam hendrerit dolor eget ante rutrum adipiscing. Cras interdum ipsum mattis, tempus mauris vel, semper ipsum. Duis sed dolor ut enim lobortis pellentesque ultricies ac ligula. Pellentesque convallis elit nisi, id vulputate ipsum ullamcorper ut. Cras ac pulvinar purus, ac viverra est. Suspendisse potenti. Integer pellentesque neque et elementum tempus. Curabitur bibendum in ligula ut rhoncus.</p>
	<p>Quisque pharetra velit id velit iaculis pretium. Nullam a justo sed ligula porta semper eu quis enim. Pellentesque pellentesque, metus at facilisis hendrerit, lectus velit facilisis leo, quis volutpat turpis arcu quis enim. Nulla viverra lorem elementum interdum ultricies. Suspendisse accumsan quam nec ante mollis tempus. Morbi vel accumsan diam, eget convallis tellus. Suspendisse potenti.</p>
	<p>Integer pulvinar leo id risus pellentesque vestibulum. Sed diam libero, sodales eget sapien vel, porttitor bibendum enim. Donec sed nibh vitae lorem porttitor blandit in nec ante. Pellentesque vitae metus ipsum. Phasellus sed nunc ac sem malesuada condimentum. Etiam in aliquam lectus. Nam vel sapien diam. Donec pharetra id arcu eget blandit. Proin imperdiet mattis augue in porttitor. Quisque tempus enim id lobortis feugiat. Suspendisse tincidunt risus quis dolor fringilla blandit. Ut sed sapien at purus lacinia porttitor. Nullam iaculis, felis a pretium ornare, dolor nisl semper tortor, vel sagittis lacus est consequat eros. Sed id pretium nisl. Curabitur dolor nisl, laoreet vitae aliquam id.</p>
	<p>Phasellus vitae suscipit justo. Mauris pharetra feugiat ante id lacinia. Etiam faucibus mauris id tempor egestas. Duis luctus turpis at accumsan tincidunt. Phasellus risus risus, volutpat vel tellus ac, tincidunt fringilla massa. Etiam hendrerit dolor eget ante rutrum adipiscing. Cras interdum ipsum mattis, tempus mauris vel, semper ipsum. Duis sed dolor ut enim lobortis pellentesque ultricies ac ligula. Pellentesque convallis elit nisi, id vulputate ipsum ullamcorper ut. Cras ac pulvinar purus, ac viverra est. Suspendisse potenti. Integer pellentesque neque et elementum tempus. Curabitur bibendum in ligula ut rhoncus.</p>
	<p>Disque pharetra velit id velit iaculis pretium. Nullam a justo sed ligula porta semper eu quis enim. Pellentesque pellentesque, metus at facilisis hendrerit, lectus velit facilisis leo, quis volutpat turpis arcu quis enim. Nulla viverra lorem elementum interdum ultricies. Suspendisse accumsan quam nec ante mollis tempus. Morbi vel accumsan diam, eget convallis tellus. Suspendisse potenti.</p>
	</div>
	<script>
	let foundParagraphs = [];
	let currentFoundIndex = 0;

	function searchText() {
	let searchText = document.getElementById('searchInput').value.toLowerCase();
	let paragraphs = document.getElementsByTagName('p');
	foundParagraphs = [];

	for (let i = 0; i < paragraphs.length; i++) {
	let paragraphText = paragraphs[i].textContent.toLowerCase();
	let index = paragraphText.indexOf(searchText);
	if (index !== -1) {
	paragraphs[i].innerHTML = paragraphText.substring(0, index) +
	'<span style="background-color: red;">' +
	paragraphText.substring(index, index + searchText.length) +
	'</span>' +
	paragraphText.substring(index + searchText.length);
	paragraphs[i].style.backgroundColor = 'yellow';
	foundParagraphs.push(paragraphs[i]);
	} else {
	paragraphs[i].style.backgroundColor = '';
	}
	}

	currentFoundIndex = 0;
	updateResultElement();
	}

	function scrollToNext() {
	if (foundParagraphs.length === 0) return;

	currentFoundIndex++;
	if (currentFoundIndex >= foundParagraphs.length) {
	currentFoundIndex = 0;
	}
	scrollToElement(foundParagraphs[currentFoundIndex]);
	}

	function scrollToPrev() {
	if (foundParagraphs.length === 0) return;

	currentFoundIndex--;
	if (currentFoundIndex < 0) {
	currentFoundIndex = foundParagraphs.length - 1;
	}
	scrollToElement(foundParagraphs[currentFoundIndex]);
	}

	function scrollToElement(element) {
	element.scrollIntoView({behavior: "smooth", block: "start", inline: "nearest"});
	}

	function updateResultElement() {
	let resultElement = document.getElementById('result');
	if (foundParagraphs.length > 0) {
	resultElement.textContent = 'Aranan metin bulundu.';
	} else {
	resultElement.textContent = 'Aranan metin bulunamadı.';
	}
	}

	</script>
	</body>
	</html>
	//sayfanın genelinde aramak için

	<script>
	function searchText() {
	var searchText = document.getElementById('searchInput').value;
	var found = window.find(searchText);

	var resultElement = document.getElementById('result');
	if (found) {
	resultElement.textContent = 'Aranan metin bulundu.';
	} else {
	resultElement.textContent = 'Aranan metin bulunamadı.';
	}
	}
	</script>