Witam napisałem sobie krótką funkcję:
$('img').click(function() {
var CLASS = this.className;
if (CLASS == "Obrazek")
{
var SRC = this.src;
$("#TransparentBackgroundGalleryID").prop('disabled',true);
$("#GalleryZoomedImageID").attr("src",SRC);
$('#EscapeZoomImageButton').click(function() {
$("#TransparentBackgroundGalleryID").prop('disabled',false);
$("#GalleryZoomedImageID").attr("src","");
});
$(document).keyup(function(e) {
if (e.keyCode === 27) $('#EscapeZoomImageButton').click();
});
} else
{
alert ( CLASS + " cos nie dziala" );
}
});
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class="BodyDiv" id="BodyDivID">
<div class="GalleryZoomedImage" id="TransparentBackgroundGalleryID">
<img id="GalleryZoomedImageID" width="90%" height="auto" src="">
<a id="EscapeZoomImageButton">Zamknij podgląd</a>
</div>
<iframe allowTransparency="true" src="Home_1.php" id="IframeBodyDiv_2" class="iframe" onload="SetSize('MyIframe')"></iframe>
<!-- Dodawanie "biblioteki" -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="ownGalleryZoomImage.js">
//Galeria: powiekszanie zdjecia
</script>
</body>
</html>
<img alt="Budowa" class="Obrazek" src="Home_1_25_926454212.JPG" style="width: 50%;" /><br />
<br />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="ownGalleryZoomImage.js">
//Galeria: powiekszanie zdjecia
</script>
W skrócie co powinna robić:
Po wciśnięciu na element rodzaju img zapisuje klasę w zmiennej CLASS. Następnie jeżeli jest to klasa "Obrazek" to: zapisuje wartość ów obrazka w SRC, ujawnia obiekt o ID TransparentBackgroundGalleryID oraz podmienia źródło elementu o ID GalleryZoomedImageID. Ponadto po wciśnięciu elementu o ID EscapeZoomImageButton ukrywa wyżej przedstawiony element oraz czyści źródło obrazka (identycznie zachowuje się poprzez wciśnięcie przycisku escape na klawiaturze).
Wnioski i problem:
Testowałem, że działa odczyt SRC i CLASS, natomiast w moim przypadku chciałbym, aby dokonywało to bezpośrednio na obrazkach zawartych w IFrame. Niestety w okienku Iframe nie reaguje funkcja. Co mógłbym zrobić, aby po wciśnięciu na obrazek zawarty w iframe funkcja reagowała wywołując elementy z "głównej strony"? Próbowałem podpiąć tą samą funkcję do podstrony wywołanej na Iframe, natomiast bezskutecznie.
