Поиск по сайту
Результаты поиска по тегам 'jquery'.
Найдено 271 результат
-
Прошу оценить первую верстку(код) Жду конструктивной критики. https://string007.github.io/
-
Данные ошибки не дают работать другим скриптам если эту строку закоментить то сразу другая ошибка я так понимаю скрипт конфликтует с чемто.. сам файл setaudiojs.js вот я добавлял к плееру http://kolber.github.io/audiojs/ползунок громкости, видимо встало криво( хоть и работает, в jquery мало понимаю поэтому половину этого файла писал с чужой помощью.. помогите избавится от ошибок
-
Задача : при клике на активное изображение в слайдере открывается Fancybox, который содержит это изображение. Структура html примерно следующая. "flex-active-slider" применяется динамически и обозначает активное на данный момент изображение. <ul> <li class="flex-active-slider"> <img src="img1.png"> </li> <li class=""> <img src="img2.png"> </li> <li class=""> <img src="img3.png"> </li></ul>JS: $(window).load(function() {$(".flex-active-slide").click(function() { var img = $(this).find('img'); $.fancybox.open([ { href: "img.attr('src')" } ]);});}В итоге, fancyvox вообще не открывается, т.е. никак не реагирует на клик.
-
Привет! Прошу критики в свой адрес по поводу сверстанного макета. Нашел его на просторах нашего Форума http://t96459jh.bget.ru/ Макет На верстку ушло примерно 5-6 дней. Насчет Responsive, для первого раза посоветовали делать статически, набить руку так сказать) Файлы макета https://www.dropbox.com/s/kk4ueg0ft2241jl/MyFirstProject.zip?dl=0
-
Прошу оценить первую верстку(код) Жду конструктивной критики. https://string007.github.io/
-
Есть два контейнера, в каждом по 4 дива. https://jsfiddle.net/y3L89Ldf/ Как можно сделать так, что бы каждые две секунды, рандомный блок из верхнего контейнера менялся на рандомный блок из нижнего? И так, что бы в верхнем контейнере не было одинаковых блоков, и что бы верхний блок, не менялся два раза подряд на один из нижних. Походу надо сделать что бы при смене верхнего блока, он менялся местами с нижним, что бы нижний потом тоже мог рандомно стать обратно в верхний контейнер? Спасибо тем, кому будет интересно одолеть задачу
-
Добрый вечер. Использую на сайте библиотеку MediaElement.js. Когда я размещаю более 5 плееров на странице, Chrome просто не подогружает страницу ( в основном стиля ), если четко 5 все работает http://omega24v.esy.es/ <div class="audio-player p1"> <h5><span>Darom Dabro</span> Darom Dabro </h2> <audio class="audio-player2" src="libs/html5-audio-player/media/DaromDabro-BL.mp3" type="audio/mp3" controls="controls"></audio> </div> $('.audio-player2').mediaelementplayer({ alwaysShowControls: true, features: ['playpause','progress','volume'], audioVolume: 'horizontal', audioWidth: 660, audioHeight: 65, iPadUseNativeControls: false, iPhoneUseNativeControls: false, AndroidUseNativeControls: false });
-
Мобильная версия сайта скроллится идеально на андроиде http://imgur.com/XeFTTES Но на айфоне скролл ломается и он нереально быстрый http://imgur.com/5UruYUI Заметил, что при открытии сайта на айфоне в код добавляется новый <div> и правка в <body>, хотя в index.html их нет <body class="scroll_wrapper" style="top: -184.702px; left: 0px;"><noindex></noindex><div id="webit_scroll_provider_wrapper" class="html" style="padding-top: 0px; padding-bottom: 0px; width: 100%; min-width: 480px;">Так же в CSS нашел это: .scroll_wrapper{ position: absolute; overflow: auto; left: 0px; right: 0px; top: 0px; bottom: 0px; padding-top: 0px; padding-bottom: 0px; margin-top: 0px; margin-bottom: 0px;}Но никак не пойму в чем проблема. Помогите, пожалуйста. Как исправить?
-
Привет всем, помогите пожалуйста. Есть главное меню. При прокрутке страницы вниз появляется фиксированное меню, в котором есть кнопка. По клике на нее открывается как бы главное меню, но теперь уже ПОД фиксированным. Главное меню содержит еще подменю иначе проблемы и не было бы. Как думал я: 1. По клике на кнопку в фикс. меню добавляем классы "fix navbar-fixed-top" к нашему главному меню. fix придает некоторые отличия по цвету, а navbar-fixed-top - фиксирует элемент вверху окна браузера. 2.Чтобы главное меню отображалось ПОД фиксированным, я придумал сделать отступ на высоту самого фикс. меню. Подозреваю, что не лучшее решение, но по-другому не придумал. 3. Главное меню исчезает при прокрутке страницы хоть на пиксель. Я решил, удалять классы "fix navbar-fixed-top" при прокрутке страницы. Аналогичные действия я проделал и для подменю,но поскольку вменю я нажимаю на ссылку (в данном случае "#"), то страница возвращается в исходное положение и подменю исчезает из-за скроллинга. Надо либо как-то сделать так, чтобы страница не прокручивалась, либо действовать другими методами. В песочнице не смог воспроизвести все необходимые эффекты, поэтому прикрепляю архив,чтобы было нагляднее. https://yadi.sk/d/S1EOVNxonmcxL <!doctype html><html><head> <meta charset="utf-8"> <title>Main</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" type="text/css" href="css/normalize.css"> <link href="css/custom.css" rel="stylesheet"></head><body><div class="fluid-container"> <header> <!--main menu--> <div class="menu" id="menu"> <div class="container"> <div class="row"> <div class="col-xs-12"> <nav> <ul> <li><a href="#">ГЛАВНАЯ</a></li> <li><a href="#" class="button-project">ПРОЕКТЫ</a></li> </ul> </nav> </div> </div> </div> </div><!--end main menu--> <!--main fix menu--> <div id = "fixMenu" class="navbar navbar-default navbar-fixed-top"> <div class="container"> <div class="row" > <div class="col-xs-4"> <button type="button" class="navbar-toggle"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> </div> </div> </div> <!--end main fix menu--> <!--project menu--> <div class="menu-projects"> <div class="container"> <div class="row"> <div class="col-xs-12"> <ul> <li><a href="#">ДОМА</a></li> </ul> </div> </div> </div> </div> <!--end project menu--> </header> <!--Some text--> <div class="wrap-content"></div></div> <!-- end fluid-container --> <!-- javascript --> <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/script.js"></script></body></html>body{ height: 100%;}ul{ list-style: none; margin: 0px; padding: 0px;}li, a{ display: inline-block;}a{ text-decoration: none; font-size: 18px; padding: 8px 30px;}.fluid-container, .container{ min-width: 970px;}.wrap-content{ content: ""; height: 2024px;}.navbar-toggle { display: block; float: left;}/* Default Menu style*/.menu{ background-color: #ffa;}/* Projects Menu style*/.menu-projects{ display: none;}/* fix menu style*/#fixMenu{ display: none;}.fix{ background: #fad;}.menu.fix{ top: 50px;}.menu-projects.fix{ top: 100px;}$(document).ready(function(){ //show/hide project menu $(".button-project").click(function(e){ e.stopPropagation(); $(".menu-projects").show(); $(".search-menu").hide(); }); $(".menu-projects").click(function(e){ e.stopPropagation(); }); $('body').click(function(){ $(".menu-projects").hide(); }); //top fix menu var $fixmenu = $("#fixMenu"); var $fixrow = $('.menu'); var $fixproject = $('.menu-projects'); $(window).scroll(function(){ if ( $('body').scrollTop() > 50){ $fixmenu.show(); } else if($('body').scrollTop() <= 50) { $fixmenu.hide(); } //delete fix row after scroll //$fixrow.removeClass("fix navbar-fixed-top"); //$fixproject.removeClass("fix navbar-fixed-top"); //show fix menu row after click $(".navbar-toggle").click(function(e){ $fixrow.addClass("fix navbar-fixed-top"); $fixrow.show(); }); //ПРОБЛЕМА ТУТ //show second fix menu row $(".button-project").click(function(e){ $fixproject.addClass("fix navbar-fixed-top"); $fixproject.show(); }); });});
-
Задание: По клику на ссылку появляется меню. По клику в любом другом месте кроме, области меню, оно должно "прятаться". Меню появляется, но не "прячется". В поиске наткнулся на такой метод как not(), но реализовать все равно не смог. Возможно не через него надо делать(?). Помогите, пожалуйста. //#button-project - ссылка, по клику которой, появляется меню.//.menu-projects - меню.$(document).ready(function(){ $("#button-project").click(function(){ $(".menu-projects").show(); }); $("not(.menu-projects)").click(function(){ $(".menu-projects").hide(); }); });
-
Добрый день! Интересует такой вопрос: есть ли что-то плохое в делегировании событий? Хочу сделать динамическую подгрузку контента на всем сайте. И чтобы обработчик событий всегда работали, думаю, использовать делегирование. То есть все обработчики вешать через body: $('body').on('event', 'selector', func); Есть ли у этого какие-то побочные эффекты, чем это может обернуться? Или можно спокойно ставить все обработчики таким образом? Спасибо!
- 3 ответа
-
- js
- javascript
-
(и ещё 2)
Теги:
-
Добрый день! Следующая ситуация: решил, вместо обновления страницы при переходе по пунктам меню использовать HTML5 History API и подгрузку контента через AJAX. Но ведь получается что после того, как я заменил основное содержимое страницы обработчики этого удаленного содержимого все еще висят где-то в памяти, так? Вот хотелось бы узнать, чем это чревато? Нужно ли после смены страницы очищать все обработчики предыдущей страницы или пускай они копятся и ничего плохого в этом нет? Спасибо!
-
Проблема в Хроме / Fixto.js / Cannot read property 'offsetHeight' of undefined
vlasenkov добавил тему в Javascript
Здравствуйте! Появилась проблема. Подлкючаю скрипт для плавающих блоков - fixto.js. Все отлично работает в ФФ, но в Хроме (пока только там) выдает ошибку "Cannot read property 'offsetHeight' of undefined". Причем демо скрипта в Хроме отлично работает. Перебровал уже кучу скриптов других, но ниодин не подходит под мои нужды. Т/к демо работает, то видимо проблема в моем подключении скрипта или в том как вызываю. Не знаю в общем, правил/переставлял/менял, но ничего не помогает. Посмотреть можно здесь - http://s16.ru/i/fznda/house.html Если нужны еще какие-то входные данные, напишите пожалуйста. Буду очень презнателен за помощь, мучаюсь с этим уже 3 день. -
Смотрел курс по jQuery от tuts+ и там оборачивали код в такую конструкцию: (function() { /* код */ })(); Перевести речь не смог, а текста к этому уроку не было. Также встретил это в уроке по созданию таймера здесь. Скажите, пожалуйста, чем эта конструкция отличается от кода без ее присутствия? В инете нигде на нашел про это информацию, а если где-то и есть такое, то записывается как очевидное и не поясняется.
-
Ребзики, коллегушки .. Верстаю сайт под смартфоны на bootstrap. Подскажите пожалуйста нормальную фотогаллерею. Требования: 1. Не громоздкая. 2. Удобная для пользования с мобилки. Заранее приподнимаю шляпу в знак уважения.
-
Привет! Есть вот такая страница с фотками: http://apriori.leveler.ru/apriori/fotogalereya.html Хотелось отойти от скучной сетки и для равномерного заполнения листа объектами я использовал FreeWall Он изменяет размеры и расположение элементов для равномерного заполнения листа. Адаптивный. Но он, гад, безбожно тормозит. Хотя на демосайте у них всё хорошо. Вопрос - он ли тормозит? И как можно ускорить первоначальную прорисовку? Может, есть более интересные альтернативы? PhotoWall я пробовал - почему-то не подружились. Надо передавать массив картинок в JSON, мне это не оч удобно. да и ошибки в нем, не смог исправить
-
Доброго времени суток! Обращаюсь к знатокам своего дела! Ребят, подскажите малоопытному )) Не работает скрипт ни в одном браузере кроме Mozilla Firefox.. Вроде все просто, суть - показывать/скрывать поля при выборе значения select в форме Подскажите в чем дело, что не так и как это исправить? Вот тело: <form name="" id="" method="post" action="" onsubmit=""> <div style="padding-bottom:10px; "> <select > <option id="" class="3" value="">Вы новый пользователь?</option> <option id="" class="1" value="">Я новый пользователь</option> <option id="" class="2" value="">У меня уже есть кабинет</option> </select> </div> <div id="my1" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 1"></input></div> <div id="my2" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 2"></input></div> <div id="my3" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 3"></input></div> <div id="my4" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 4"></input></div> <div id="my5" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 5"></input></div> <div id="my6" style="display:none; padding-bottom:6px; margin-top:14px;"><input name="submit" id="submit" value="Принять" type="submit"></div></form>Вот скрипт: $(".1").click(function(){$('#my, #my1, #my2, #my3, #my4, #my5, #my6').fadeOut('slow');$("#my, #my1, #my2, #my3, #my4, #my5, #my6").toggle(1000);});$(".2").click(function(){$('#my, #my1, #my2, #my3, #my4, #my5, #my6').fadeOut('slow');$("#my, #my3").toggle(1000);$('input[name="other"]').attr('value','');});$(".3").click(function(){$('#my, #my1, #my2, #my3, #my4, #my5, #my6').fadeOut('slow');});подключаю JQuery 1.9.1 Вот ссылка на мою форму - http://jsfiddle.net/2w18do1z/1/ или здесь, кому как удобнее - http://codepen.io/anon/pen/MaOxMb Буду благодарен за Ваши советы и помощь!!!
-
Спасибо. Сделал на CSS3
-
На этой странице кнопка теряет тень при нажатии http://codepen.io/462960/pen/avqjoe Сразу после чего должна вернуться в исходное состояние. Пробовал 2 варианта. Оба завязаны на .one() Отмены нет, прошу знатоков подсказать.
-
Всем привет! Срочно ищем в офис в Москве на полную ставку отвязного frontend-разработчика с навыками джедая. Полное описание вакансии здесь: https://moikrug.ru/vacancies/1000021706 Пишите на почту из текста вакансии или мне в личку.
-
В IT компанию (разработка ПО) приглашается Frontend developer. Требования: - знание JavaScript, jQuery, AngularJS или BackboneJS; - знание и понимание HTML5 технологий; - знание ReactJS (как преимущество); - умение верстать кроссбраузерные адаптивные страницы; - понимание современных тенденций в области Front-end разработки; - опыт работы с Grunt / Gulp, SCSS и другими инструментами; - опыт работы с системами версионирования; - владение английским языком (чтение документации). Обязанности: - создание SinglePage Application разного уровня сложности; - реализация интерфейсов по макетам дизайнеров; - оптимизация существующих приложений. Условия: - оформление согласно трудовому законодательству и «белая» заработная плата; - размер заработной платы обсуждается с успешными кандидатами, по результатам собеседования; - пятидневная рабочая неделя, график работы с 9 до 18 часов, - офис расположен в историческом центре города; - возможности для роста и обучения. Контакты для связи: E-mail: [email protected] Skype - valeriya390 Тел.: +7 (916) 072 29 58 Валерия
- 7 ответов
-
- JavaScript
- jQuery
- (и ещё 6)
-
Доброго времени суток! Обращаюсь к знатокам своего дела! Ребят, подскажите малоопытному )) Не работает скрипт не в одном браузере кроме Mozilla FireFox.. Вроде все просто, суть показывать/скрывать поля при выборе значения select Вот тело: <form name="" id="" method="post" action="" onsubmit="return validateForm();"><div class="" style="padding-bottom:10px; "><select ><option id="" class="3" value="">Вы новый пользователь?</option><option id="" class="1" value="">Я новый пользователь</option><option id="" class="2" value="">У меня уже есть кабинет</option></select></div><div id="my1" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 1"></input></div><div id="my2" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 2"></input></div><div id="my3" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 3"></input></div><div id="my4" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 4"></input></div><div id="my5" style="padding-bottom:10px; display:none;"><input type="text" placeholder="значение 5"></input></div><div id="my6" style="display:none; padding-bottom:6px; margin-top:14px;"><input name="submit" id="submit" value="Принять" type="submit"></div></form>Вот скрипт: $(".1").click(function(){$('#my, #my1, #my2, #my3, #my4, #my5, #my6').fadeOut('slow');$("#my, #my1, #my2, #my3, #my4, #my5, #my6").toggle(1000);});$(".2").click(function(){$('#my, #my1, #my2, #my3, #my4, #my5, #my6').fadeOut('slow');$("#my, #my3").toggle(1000);$('input[name="other"]').attr('value','');});$(".3").click(function(){$('#my, #my1, #my2, #my3, #my4, #my5, #my6').fadeOut('slow');});подключаю JQuery 1.9.1 Вот ссылка на мою форму - http://jsfiddle.net/2w18do1z/1/ или здесь, кому как удобнее - http://codepen.io/anon/pen/MaOxMb Буду благодарен за Ваши советы и помощь!!!
-
Разрабатываю небольшой сайт (просьба сильно не бить - это мой первый сайт и он еще не закончен) emwhp.com использую anchor.js для плавного к содержимому страницы по щелчку на каруселе : jsfiddle.net/psrRQ/4/ (исходник откуда брал скрипт) при попытке прокрутить карусель(брал исходники bootstrap) влево или вправо скрипт уводит видимую область экрана ниже меню. Подскажите пожалуйста как поправить.
-
Здравствуйте! Есть задача сделать вот такой слайдер - https://yadi.sk/i/v6QfPqsxjcNdM (при наведении на каждый из трех кусочков изображений, соответствующее изображение должно появляться полностью, как бы раздвигаясь, уменьшая-сдвигая остальные). Все было бы хорошо если бы не диагональная обрезка изображений, т.е. при уменьшении ширины изображения диагональный край обрезается и становится обычным. Насколько возможно/сложно сделать такой слайдер? Буду очень признателен за наводку в какую сторону смотреть, чтобы такое реализовать.
-
jQuery(function($) { $('#amoney .south').click(function(){ $('#amoney .south').removeClass('active'); $(this).addClass('active'); });});jQuery(function($) { $('#amoney').on('click', '.south', function(){ $('#amoney .south').removeClass('active'); $(this).addClass('active'); });});работают но как то странно написано <div id="amoney" class="amoney-module" style="text-align: center;"> <div id="amoney1" class="amoney-mod1" style="text-align: center;"> <span class="panel1"><a class="south" style="margin:3px;text-decoration: none;" onclick="hide_all()" title="" data-original-title="Скрыть все">Благодарность Автору</a></span> </div><div id="amoney2" class="amoney-payment" style="text-align: center;"> <!-- Link Edit --> <a id="ammh1" style="margin:3px;" class="south" title="" onclick="show_wm()" data-original-title="WebMoney"></a> <a id="ammh2" style="margin:3px;" class="south active" title="" onclick="show_rupay()" data-original-title="RBKMoney"></a> <a id="ammh5" style="margin:3px;" class="south" title="" onclick="show_paypal()" data-original-title="PayPal"></a> <a id="ammh8" style="margin:3px;" class="south" title="" onclick="show_robox()" data-original-title="ROBOKASSA"></a> <!-- Link Edit --></div></div>многим хватает этого: $(document).ready(function(){ $(".menu li a").click(function() { $(this).parent().addClass('active').siblings().removeClass('active'); }); });Возможно, облегчить скрипт?