Luis
Luis

Reputation: 69

Change image on iframe with JQuery

I need to change an image with jQuery when I click on image of my webpage I need that the page show me a prompt, alert... or similar where I put the new path of the new image.

Anyone have any idea?

I show my code where I change paragraphs and headers with Jquery, I need similar but for images.

$("#probando").contents().find("#cabecera1").click(function () {
    var nuevoTexto = prompt("Introduzca el nuevo contenido");
    $("#probando").contents().find("#cabecera1").text(nuevoTexto);
});

The image that needs changed is in an frame.

<iframe id="probando" src="prueba2.html" scrolling="auto" height="700" width="750" marginheight="0" marginwidth="0" name="probando"></iframe>

Upvotes: 0

Views: 737

Answers (2)

Sylordis
Sylordis

Reputation: 2559

Something I don't understand : You have to click on an image which is in a frame, and when you do, a prompt appears to write a new path for the image. When the prompts submitted, the image changes of src, is that it ?

In that case, you can directly write the code on the frame's included page.

$().ready(function() {
  $('#imageId').click(function() {
    var newPath = prompt('Please enter new path for image :');
    $(this).attr('src',newPath);
  });
});

If it's not the case, please explain what's the structure and what is where =)

Upvotes: 2

AMIT KANALA
AMIT KANALA

Reputation: 1

<!DOCTYPE html>
<html>

<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
    <title>iframehide</title>
    <script type="text/javascript">
        $(function() {
            var f = $('#foo')
            f.load(function() {
                f.contents().find('div').hide();
            })
        })
    </script>
</head>

<body>
    <iframe id="foo" src="iframehide-frame.html" /></iframe>
</body>
</html>

Upvotes: 0

Related Questions