JQuery does not work.

Like I said: jQuery does not work. This choice, what am I doing wrong? although it works with other parameters. Here's the mt mini gallery code, which should enlarge the selected image and move down not selected (works on separate tho elements)

$(document).ready(function () {
    $("#content img").click(function () {
        $("#blackb").slideDown("slow");
        $("img", this).animate({
            right: "20%"
        });
        $("img", this).animate({
            top: "20%"
        });
        $("img", this).animate({
            width: 802,
            height: 584
        }, "slow");
        $("#content img").not(this).animate({
            top: "80%"
        }, "slow");
    });
});

HTML part:

<div id="content">

    <img id="second" src="model.jpg" alt="model" />
    <img id="third" src="model.jpg" alt="model" />
    <img id="fourth" src="model.jpg" alt="model" />
    <img id="first" src="model.jpg" alt="model" />
    </div>
<div id="blackb"></div>

CSS part:

#content img {
    position: absolute;
    top: 50%;
    right: 50%;
    display: none;
    width: 160px;
    height: 116px;
    border: 2px solid white;
    z-index: 10;
}
#blackb{
    display: none;
    position: absolute;
    top: 0;
    width: 1280px;
    height: 888px;
    background: black;
    opacity: 0.7;
    z-index: 9;
}
+3
source share
1 answer

$('img', this) looks for a node image in the context of your node image that was clicked.

Since the image cannot be a child of the image, this makes no sense.

You can select with $(this)or attach a click to something higher and continue to use thisas a context.

+2
source

Source: https://habr.com/ru/post/1758962/


All Articles