Creating a mouse wheel navigation option for horizontal carousel of images
I have made a horizontal carousel of images (and captions) using Twitter Bootstrap 4 and the perfect-scrollbar plugin. I want users to be able to navigate by using the mouse wheel. The plugin dos have a handlers option that I did use. Here is a jsFiddle with what I did so far. But it does not work the expected way. Like THIS, for instance. Questions: Am I using it wrong, or does the plugin not have such an option? What alternatives do I have?
Undefined type error for variable - need help
I'm getting a type error: lastSelectedRow is undefined. What I'm trying to do is allow the user to select multiple rows of a table using Shift+Click. I was searching for an example and came across this article: https://stackoverflow.com/questions/17964108/select-multiple-html-table-rows-with-ctrlclick-and-shiftclick I implemented one of the examples with jquery. Here is the code I'm trying: j$ = jQuery.noConflict(); j$(document).ready(function() { if(j$) { //alert('Jquery loaded successfully...');
How to do “only one TABLE column” responsible for drag and drop? ( touch-punch )
How do I GET ONLY ONE COLUMN to be responsible for drag and drop? <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.2/jquery.ui.touch-punch.min.js"></script> <script> $(document).ready(function () { $("#sortable").sortable(); $("#sortable").disableSelection(); }); </script> <table class="table table-hover
Jquery,ajax not working for me in chrome
in Using jQuery • 6 years ago Hi! Iäve up till now tested my site in explorer and it worked fine but when i tested it in google chrome it didn't work and i have no idea what the problem is. Please help me :( Chrome console Code Uncaught TypeError: Illegal invocation at i (jquery.min.js:2) at jt (jquery.min.js:2) at Function.w.param (jquery.min.js:2) at Function.ajax (jquery.min.js:2) at login (system-v2.js:7) at saveLocalStorage (system-v2.js:2) function saveLocalStorage(e)
Retrieving the Response from $.getJSON
Hi everyone, How do I get the response coming back from my $.getJSON function? I can see it here: Thank you, Neil
Set innerHTML using Json
Issue: first name is undefined. Json output from User.php [{"firstname":"John","lastname":"Doe","user_email":"john.doe@email.com","access_id":"1","role_id":"2","status":"enabled","company_name":"ABC Inc","mailing_address":"Earth","shipping_address":"Earth","email_address":"","phone":"(555) 555-0000","fax":"(555) 555-1111"}] User.js $(document).ready(function () { /* call the php that has the php array which is json_encoded */ $.getJSON('user.php', function (user) { document.getElementById("firstname").innerHTML
Cycle through different sized images on scroll
Hi all, I am trying to change through images when scrolling, (and I understand that maybe the jquery is a bit messy but it seems to be working) but i would like: - to be able to have images of different heights and widths, not all the same size (as it is now). - vertically/horizontally centered. Here is a fiddle: https://jsfiddle.net/postcolonialboy/WTkqn/486/ Thanks! HTML: <div id="contentwrapper"> <div class="centreme"> <img src="https://picsum.photos/200/200?image=1" id="animation"
adding class only if scrolled down
Hi! I have my lightgallery opened and want before closing it my class only to be added when the main page is scrolled down a bit. $("#LGbest").on({ 'onBeforeOpen.lg': function(event) { $("body").removeClass("scrolled-down-top").addClass("scrolled-down-home"); console.log(event.name,event); }, 'onBeforeClose.lg': function(event) { $("body").removeClass("scrolled-down-home");//add class if scrolled down .addClass("scrolled-down-top");
I used ajax to load the content of a page from my database, but it can't just display on mobile phone
Please someone should help me out, i used ajax to load the content of a page from database, but am having an issue right now, its displaying fine on my laptop and infinix ZERO3 but cannot display any content on some mobile phones (like iphone4s), what can i do to solve this?
how to use bigint of sqlserver in javascript/jquery var.
hi, I am getting some data using ajax [json], but in javascript it does not support bigint data, becasue it is big. so please tel me some solution at javascript level. yours sincerely
how can toggle the active class on sidebar menu when it's clicked and page reloads
i am trying the add and remove active class on sidebar menu, in such a way that when user select a particular link it should be active until another one selected HTML <ul class="sidebar-menu"> <li class="header">MAIN MENU</li> <li class="treeview"> <a href="../AdUserATTENDANCE/Welcome.aspx"> <i class="fa fa-dashboard"></i><span>MY DASHBOARD</span> <i class="fa fa-angle-left pull-right"></i> </a> </li> <li class="treeview">
Select2 Multiple Dropdown
How to get the newest selected value of select2 multiple dropdown
Cropping image
Can I save the cropped image at client side. If possible Plz suggest me what to do. Thankyou
Click element within list and change bg color on that element, and all the previous once
So I have a list <ul> with small tables inside <li>html code table...</li>. I need to click the table and change the backgound which would be pretty simple: $('.table-inside-li').on('click', function () { $(this).toggleClass('background-selected'); }); But the thing is that I also need to change the background of all tables that are within previous <li> as well. They are all lined up horizontally (well I guess it doesn't matter if it's vertical or horizontally as far as the solution
Access table rows without column header row
I'm new to jquery and trying to learn how to traverse the DOM. I'm trying to access the rows of a table, but not the table row with the column headers. I have the following code: j$ = jQuery.noConflict(); j$(document).ready(function() { if(j$) { //alert('Jquery loaded successfully...'); } console.log(j$('input[id$=btnSearch]')); j$('input[id$=btnSearch]').click(function(){ console.log(j$('[id$=searchTable]')); }); }); I'm first checking for the search button on the page. Then I am adding
embedded jQuery Code of ajax load page?
I have an html file oldStudent.html That has the following jquery code : <script> $(document).ready(function () { $("div").each(function (index) { var idDiv = $(this).attr('id'); if (idDiv) { $("#" + idDiv).load(idDiv + "_v1.html"); } }); }); </script> Now in another page Student.html i am loading the oldStudent.html
Linkify (plain url to link) based on windowSize
Hi all, this is what i would like to do 1. when window size is < 1000, change any plain text url to a clickable one 2. when window size is > 1000, change any plain text url to a clickable one, replaced by the word "Link". I had a go but it seems to be failing somewhere! Anyone can shed some light? Thanks <html> <head> <script src="https://code.jquery.com/jquery-3.1.0.js"></script> <script>$(document).ready(function() { function checkWidth() { var windowSize = $(window).width();
link only on visible image
The 4 images are stacked and the appearing is controlled by css changing opacity. I try to get a link on only the last one of the images. Only if the one is shown, it should be clickable. A simple link to index.html... <div class="fixed-top container d-block w-50 nachvorn" data-pg-name="Augen" id="LGschliessen"> <div class="augenlogo"> <a href="#" > <img class="augen" src="images/navbar/augen.png" alt=""> <img
Add border to objekt while draging/reorder
I need to add a border while draging and reorder a table within a list: $(function () { $("#sortable").sortable({ start: function () { $(".my-table").css("border", "1 px solid #202020"); }, stop: function () { $(".my-table").css("border", "none"); } }).disableSelection(); }); This approach doesn't work. So how could this be done?
Compare two separate files for similar elements?
Hi friends, I have two files. oldCourses.html and newCourses.html. oldCourses.html has elements <div id="courses-details"> <div> <div colspan="4"><b>2017 School Courses</b></div> </div> <div> <span>1.</span> <span>History</span> <span data-content-type="history" data-key="1" teacher-value="John"> John</span> </div> <div> <span>2.</span> <span>Sciences</span> <span i data-content-type="sciences"
Need to force focus if there is an error
Hi, Can someone help me edit this code that instead of hiding the submit button ($("#submit_button").css("display" , "none");) when there is an error, rather to just show the error message ($('#tfa_4929-D').append("<div class='error' style='color:red;'>Invalid number. One can only submit this form if this field is blank or it contains a valid number.</div>");) and force focus to the correct field that has the error? Here is the snippet that I need edited. jQuery(document).ready(function($) {
hi guys, i have a question about animate function
Tết Này một mực Phải mua Ngay Bộ Đồ Lót Nữ Đón Năm Mới Bạn thiếu tự tin giả dụ không tô son? đặc biệt, ở đây với những hàng ghế trắng xếp san sát nhau, trông rất bụi bặm và đậm chất phương Tây. Phun môi pha lê 3D là cách giải quyết tình trạng môi thâm, môi ko đều màu, môi quá dày hay quá mỏng, môi khô, đem lại cho bạn một vài môi căng mọng, đầy sức sống sở hữu màu môi trẻ trung, lóng lánh đầy quyến rũ như ánh pha lê trên bề mặt môi. Ở Trung Quốc, đề cập đến cặp đôi LGBT nổi bật, người ta sẽ thủ thỉ”
rails and jquery mobile: serious issues
I would like to create a mobile version of my rails 5.0.0.1 application. Once downloaded and installed jquery mobile 1.4.5, however I encountered serious issues: css rules are not respected, redirects fails, javascripts do not work, colours are blurred, buttons do not work... I tried both the full versions and the minimal versions of the css an js files with the same bad result. I am using jquery-rails version 4.1.1 and I am wondering how can I get jquery mobile to work, whether would you advice
Parsing JSON table: hiding a row, changing color of word.
Hi all, I am using jquery to convert a google spreadsheet to JSON that produces a HTML table. I would like to: - hide one of the rows that has the phrase "E9" in it. - change the color of the phrase "C12" to red. I have tried many scripts, but to no avail! Here is the code I currently have. Thank you very much! <html> <head> <script src="https://code.jquery.com/jquery-3.1.0.js"></script> <script> //google spreadsheet var spData=null;function doData(a){spData=a.feed.entry}function
How to fix var when jsFiddle says var already defined
Here is my fiddle https://jsfiddle.net/juggernautsei/w8yn2ehk/ $(function() { $("input[name$='notify_type']").click(function() { var test = $(this).val(); var selected = $("input[type='radio'][id='notify_type3']:checked").val(); $("div.referral").hide(); $("#ref" + test).show(); if(selected == "4") var opts = [ {name: "Please Select", val:""}, {name:"WMOX", val:"WMOX"}, {name:"WVKL", val:"WVKL"},
Auto response ui : Send additional Paramter
Dear sir/Madam refer http://prajaktasoftware.com/egram/testuseradd.php?id=36 The autocomplete working file. However I want to filter the result I have 2 filters Pls refer following form We have 2 filters 1. Filter 1 2. Filter 2 I want to send parameters selected in filter 1 and filter 2 for auto-search Code $(function() { $("#gp").autocomplete({ source: "gpautofill.php", minLength: 2, select: function(event, ui) { $('#gpid').val(ui.item.recid); }, //html: true, open: function(event, ui)
Loading a file to cache only
I find the opposite question a lot, but I haven't found the answer to this one yet! :-) I'm trying to load a file in to the user's cache, but not actually use it on that page. The logic is, on the first page load I would use PHP's include() to load the CSS inline, then at the bottom of the page I would load the external CSS file to cache it and set a cookie to signify that it has been cached. Then on the second page load I would test for the cookie, and if present I could link to the CSS like normal.
jQuery application: trying to make the “wheel” event listener discontinuous fails
I am working on a small "Picture browser" application in Bootstrap 4 and JavaScript. As can be seen in THIS jsFiddle, there is a "Prev" and a "Next" button that help navigate through the pictures. I have bean trying to find a reliable method to make mouse well scrolling function the same as these buttons. Scrolling down would be the equivalent of clicking the "Next" button. Scrolling up would be the equivalent of clicking the "Prev" button. Firing the showSlide() function on mouse wheel does work,
Defining CSS based on whether user is at top or scrolled down
I'm having a sticky navigation issue that's causing anchor links to scroll too far or not far enough, depending upon whether the page has been scrolled down in the slightest. As soon as the user starts to scroll down, the header section is reduced in height with only the navigation remaining. Is there a way to define CSS for an anchor based on whether the click on the nav link occurred while scrolled to top or not scrolled to top? Here's what I have so far, but the .anchor changes to the non-top
on click and automatic image cyclers crossfade consistentcy
Hello guys! I'm new to this forum and jQuery and would like to ask for your help.:) I have this code for an automatic image cycler and I really like the smoothness of the crossfade, it also works independently with identical .wrappers containing children divs: $(".wrapper").on("click", function() { var $content = $(this).children(); if ($content.length > 1) { var $curr = $content.filter(":visible"); var $next = $curr.is($content.last()) ? $content.first() : $curr.next(); $next.fadeIn(2000) $curr.fadeOut(2000)
Reading from a separate config file
I wish to know what is the right way to use a 'configuration' file for my jQuery plugin. I'm using an editor that accepts configuration options. Right now I've a format that looks similar to - `editor.js` ``` let config = { opt1: 'someVal', opt2: 'someOtherVal' } $(".editor").awesomeEditor(config); ``` I was thinking I should maintain a separate config file instead where I define `config` options. But then, what is the right way to include this new config file so that my plugin
question about Regarding Datepicker ?
Hello, I am using datepicker, its having an issue on window phones 8. when I zoom in/ zoom out and scroll left/right the position of datepicker is not changed as required, its left top cordes not changed as per zoom out or zoom in. its stable where we open that first time or where the textbox situated. I have take a demo which is given by jqueryui.com, its also have the same problem. is it possible to make it window phone compatible. Thanks & Regards
Add and Remove Data from one table to another
I am looking for a way that if I click on the Add button then the data is passed to the include-table. Here is the code: <div id="table-scroller"> <table class="table table-striped table-hover dataTable catalogueContractsTable admin-form theme-primary" cellspacing="0" width="100%" role="grid"> <thead id="tableHeader"> <tr> <th class="bg-white">Name</th> <th class="bg-white">Contract Type</th> <th class="hidden-xs bg-white">Start Date</th> <th class="hidden-xs bg-white">End Date</th> <th class="hidden-xs
jQuery OnBeforeUnLoad Not Working Properly
Usually when using Javascript onbeforeunload to detect page reload or page refresh events, if the refresh or reload is detected, a popup appears displaying a message and the options to either cancel or leave the page. The problems I'm having is number one, my custom message is not displayed but instead a default message is displayed in Chrome. And two, I would like to call a method when a user clicks the Leave Page option. I've read that this can be achieved using the unload function but it is
$.when() surprisingly differs from $.Deferred.promise()
What we have The jQuery documentation describes $.when() as a sort of the promise generator: If a single Deferred is passed to jQuery.when(), its Promise object (a subset of the Deferred methods) is returned by the method. The Deferred.promise() chains all three its event pairs: resolve() - done() reject() - fail() notify() - progress()At the same time, the $.when() returns a promise which chains the only two event pairs: resolve() - done() reject() - fail() Look to the following screenshots: Deferred.promise
Question about value
Wines From Rioja Khỏe Đẹp Thật Dễ Kem nền trước tiên tương hợp mang kỹ thuật Ultra HD hay còn gọi là kỹ thuật 4K được sáng chế dành cho lĩnh vực công nghiệp điện ảnh, mang lại làn da đẹp hoàn hảo, thiên nhiên trước ống kính. Mặt khác, mọi người cho rằng khi dùng chung 1 phương pháp trang điểm đẹp mắt sẽ giúp cho hình ảnh tư nhân có thể được bộ lộ 1 cách thức hoàn thiện và có dấu ấn biệt lập. thực hiện từ tối thiểu hai tháng để thấy được hiệu quả cải thiện. cùng lúc, nếu bạn muốn tạo điểm nhấn cho
Mobile Popup Help Please
Hi Everyone I am new to these forums and to jquery mobile and starting to develop strong feelings for Jquery Mobile :-) But we have hit a stumbling block in our relationship and I hope someone can help :-) Jquery - 1.11.1 Jquery Mobile 1.4.5 I am using the lightbox code as shown in the documentation and would like to place a link and text the thumbnails so users can be directed to another page but also maintain the popup functionality. <a href="#popupParis" data-transition="fade" data-rel="popup"
Autocomplete "problem"
Good morning, I have a simple page with a jquery autocomplete which calls a php file. It works fine. The problem is that sometimes the sugestions are too many, so the dropbox extends to the bottom of the page (the user has to scroll the page - a lot). Is there a way of defining a smaller dropbox with some kind of scroll?... Or placing the results in another area? Sugestions are welcome. Kind regards Miguel
How to make selector dynamic
Hi Friends I am very new to jquery and stuck with one problem. problem is I have two dropdowns and onchange event of first drop down i am populating options of second dropdown. then I have extended this functionality with add more option where i am adding both the drop downs again. But the problem is in ajax success method m appending options to specific select box how can I make them dynamic??
Vulnerable struts2-jquery-plugin-4.0.3 jar
Dear All, I am using struts2-jquery-plugin-4.0.3.jar in my web application. This jar contains jquery-2.2.4 which is a vulnerable version of jquery.Now struts2-jquery-plugin-4.0.3 is the latest available jar which is with the vulnerable version. Any one can suggest the solution?? Thanks in advance. Regards, Abhay
Next Page