Не могу разобраться с getelementsbyclassname
Ребят, только начинаю знакомиться с js. Помогите никак не могу понять почему не работает код. FF выдает ошибку
TypeError: $(...).getElementsByClassName is not a function pop_up.js:8:16 сам код: $(document).ready(function () { $(".image").click (function () { var img = $(this); var src = img.attr('src'); var scrt = $(window).scrollTop(); $("body").append("<div class='popup'><div class='popup_bg'></div><img src='" + src + "' class='popup_img'/></div>"); $(".popup").fadeIn(800); var s = $(document).getElementsByClassName("popup"); for (i=0;i<s.length;i++){ s[i].style.top = scrt+"px"; } $(".popup_bg").click (function () { $(".popup").fadeOut(800); setTimeout(function () { $(".popup").remove(); }, 800); }); }); }); |
Строка 8 должна быть
var s = $('.popup'); |
laimas,
странно, а что возвращает $(document)? |
Цитата:
можно так var s = $(document)[0].getElementsByClassName("popup"); но зачем? |
Alex00001,
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style type="text/css"> body{ position:relative; } .image{ margin-top:1500px; width:300px; } .popup img{ width:80%; } .popup_bg:after{ content:"x"; font-size:48px; margin-top:50px; display:block; text-align:right; } .popup{ text-align:center; position:absolute; } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> $(function() { $(".image").click(function() { $(".popup").remove(); var src = this.src; var top = $(window).scrollTop(); var popup = $("<div class='popup'><div class='popup_bg'></div><img src='" + src + "' class='popup_img'/></div>") .css({ top: top }).appendTo("body").hide().fadeIn(800); $(".popup_bg", popup).click(function() { popup.fadeOut(800, function() { popup.remove(); }); }); }); }); </script> </head> <body> <img src="http://okultureno.ru/upload/medialibrary/40e/bk_info_orig_75900_1474440457.jpg" class="image" alt=""> </body> </html> |
Ребят, спасибо что так оперативно откликнулись.
|
Часовой пояс GMT +3, время: 05:37. |