J Query problem where the image slides down but then fades out when i move the mouse. I tried using a delay but it doesn't look as good. Any fixes
J Query: <script src="jquery.js"> </script> <script> $(function() { $("#SeeAllEvents").hide(); var timeoutId; $("#facebook").hover(function() { if (!timeoutId) { timeoutId = window.setTimeout(function() { timeoutId = null; $("#facebook1").stop(true,true).slideDown('10000'); }, 500); } }, function () { if (timeoutId) { window.clearTimeout(timeoutId); timeoutId = null;
$( ) parsing content inside <script> tags incorrectly?
Hi, In my application, I dynamically load content from the server that consists of a mix of <script> and <style> tags returned by a single request. When the content to load includes a <script> tag which contains the string "<foo/>", the script that gets added to the document is being modified by jQuery to contain the string "<foo></foo>". You can see it with the following example: $('<script type="text/javascript">var a="<foo/>";</script>') results in: [<script type="text/javascript">var a="<foo></foo>";</script>]
Set the Tab Created as Active Tab
Hi, New to jquery UI...was working with jquery UI - Tab Control http://jqueryui.com/tabs/#manipulation After the tab is created, i want to have it selected. This code is based of the sample in the link above function addTab(controld) { var tabTitle = controld; var tabContent = "tab Content "; var tabTemplate = "<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close' role='presentation'>Remove Tab</span></li>"; var label = tabTitle, id = "tabs"
accessing php using ajax
Sorry may be this question not related here : which is best approach placing all different methods in one php page and accessing that page from ajax or placing different methods in different pages and accessing them separately with ajax pls reply me fast pls
How to set switchButton from dynamically data constructed ?
Hi, the value global (true or false) was constructed from a json, I don't know how to set the valye of each switchButton in a td, here is the fiddle : http://jsfiddle.net/mlotfi/cddyx4vr/ Thanks.
.click() not working
I'm trying to create a link dynamically and click it. My initial code works, but it uses a deprecated javascript method: var a = document.createElement('a'), ev = document.createEvent("MouseEvents"); a.href = url; a.download = url.slice(url.lastIndexOf('/')+1); ev.initMouseEvent("click", true, false, self, 0, 0, 0, 0, 0, false, false, false, false, 0, null); a.dispatchEvent(ev); But initMouseEvent is deprecated. So I thought I would use the jQuery .click method instead: var a = document.createElement('a'),
How to turn on debugger in chromebook
Hello, Im writing a app for chromebook. How do I turn the debugger on in chromebook? Thank You.
Need help to write text in td
Hi, Need help. I have table (tableA) with single td. (multiple rows) td having checkbox (checked or unchecked.) I create clone of tableA and in that I don't want checkbox. Instead of that I want some text like "checkbox checked" or "checkbox unchecked" On button click what I done so far is: function buttonClick() { //Create clone var t = $('#tableA').clone(true); //remove all href tag in side td $('a', t).filter(function () { return $(this)}).removeAttr("href");
jQuery to move the scroll-bar to start of news-article
Hi guys, I have infinite scroll (Paul Irish) implemented on a news-articles-blog and it is working fine. The structure is like this: 1-full article 1.1-comment box 2-full article 2.1-comment box 3-full article 3.1-comment box etc. When the user has read full article (3) and clicks the "back" button one time then he can read full article (2). However, when the "back" button is clicked one time, my scroll bar moves up to the middle of 1.1-comment box (!!!) instead of moving to the article start (=
switchButton is not working in ie
Hi, I always use chrome, used switchButton in my code working fine, byt was surprised when I load the page in ie 11, it did not show the nice switch Button with ON and OFF, it just show a classic checked checkbox, here is a pic of the inspector in ie and chrome :
Making a Youtube video full screen.
I have code that can make a html video tag full screen, but that code does not succeed with Youtube videos. Youtube videos are embedded in iframes, and the code will maximize the iframe, but it will not maximize the video within the iframe. So you get a black screen that covers your monitor, and in the upper left, you have the video, still the same size that it was. I might guess that I could reload the youtube video once the iframe was maximized, but it did not seem to work. This is my iframe:
bxSlider problem
Hello World! Starting diff.s. :difficulty with Step 3 : Call .bxslider() on <ul class="bxslider"> . Note that the call must be made inside of a $(document).ready() call , or the plugin will not work! I don't know what I should do extra to make the script ok: see bold text. Herunder my index page sofar: <html> <head> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <title>index</title> </head> <body> <ul class="bxslider"> <li><img src="/images/pic1.jpg"></li> <li><img src="/images/pic2.jpg"></li>
How to change the product of a calculation during a "slide" event with JQuery UI slider
Hi there I've got a UI Slider in a site that allows the user to set one of a number of values that are then calculated through the JS script. I've created the function 'calculate' for this. I would like 'calculate' to occur on the slide event, so the product of the calculation changes on screen as the user moves the slider. I thought this might relate to the order in which I call the scripts, but in the console it looks like the 'calculate' function is simply not happening, which makes me think
How to make bxSlider work responsively, using old version
Hi everyone, I am new to this forum and new to bxSlider. I hope I am posting in the right group. I have created a carousal slider using bxSlier plugin following an article http://htmldoc.net/2012/11/centered-bxslider-slideshow-with-custom-slide-opacity/. The end result is here http://alpha.klmnweb.com/sliders I have made some css customization here and there. It's working find and to what I expected. But the slider is not responsive at all. I tried many css rules still the images do not shrink
Jquery validator
How to validate drop down list by using J query Validation plug in ?
Doing math on variable if box is checked...
Hi all, this is my first post here (I think) so I hope I'm in the right area, basically I've wrote a form for a club I'm involved in and I'm trying to add the paypal fees (3.4% + 20p ) to a variable if 'pay by paypal' is checked, this is the jquery bit, I've put the bits I'm interested in, into a JSFiddle Thanks in advance $('.items').click (function () { if ($(this).val() == "champcomp" || $(this).val() == "competitor" ) { var value = "30.00"; } else { var value = "0.00"; } $('#hidd_item1')
field limit for Jquery validator
I've made validation of password field.which will take character between 6 to 16 but this is not working.it does'nt give any validation message. $.validator.addMethod("password",function(value,element){ return this.optional(element) || /^[A-Za-z0-9!@#$%^&*()_]{6,16}$/i.test(value); },"Passwords are 6-16 characters"); // Validate signup form $("#signup").validate({ rules: { email: "required email", username:
Owl Carousel disappears after 1st time
I'm creating a JQM site and I've incorporated the Owl Carousel. I'm initializing it through the $(document).ready function as instructed on the Owl website. $(document).ready(function() { $("#event-slider").owlCarousel( { singleItem : true, margin: 30 } ); }); The carousel displays perfectly, however as soon as the user navigates away from the landing page and is returned to it with: $(":mobile-pagecontainer").pagecontainer("change",
Why does this event not work?
Hi, This is the event I have, but I need to change it so it can accept dynamically created elements being dropped on it. the time-line-schedule element is permanent, but the event-box class comes and goes. $('#time-line-schedule .event-box').droppable({ hoverClass: "hoveringAbove", activeClass: "hoveringAround", drop: function( event, ui ) { } }); I change it to this but the event never fires. Any idea what I'm doing wrong here? $('#time-line-schedule').on("drop",".event-box",function(event,
superfish question
Hello, I'm not sure if I'm in the right spot for this. I have a superfish question and I was told I could come to this forum because there are a lot of knowledgeable people who know superfish. Please move this post to a different category if it's in the wrong place. I'm new to the superfish menu and I have a couple questions: 1) How can I get just one menu item not to highlight when I hover over it? I would like all other menu items to highlight, which I've done, but now I'd like just one NOT to
Help with Query Selector
Hello, I'm trying to figure out the jQuery selector so that I can change an item but for some reason I can't figure it out to select it. I"m trying to get to the <button> in the following html. I can change the <tr>, <td> or even <div> but I can't get to the <button>. What I'm trying to do is when I select an HREF from the dropdown button then I turn on the LaddaSpinner for that button. This just shows a spinner to the right of the button. I'm trying to use the "closest" selector to turn on the
appending to non existance selector
hey guys im trying to create a selector in a foreach loop and append to it further down in my code what is the best way to achive this please? $.each(data, function(category, stuff) { $("#categories").append('<li id="category_'+ category +'">' + category + '</li>'); $.each(stuff, function(sub_category, items){ // $('category_' + category).append('<li id="sub_category_'+ sub_category +'">' + sub_category + '</li>'); // here is the error.
google map automatically zooms one out when getting bounds from session
I work on a google map where I try to make the map remember the bounds when refreshing. In order to remember the coordinates, I use the following procedure. The function that saves the bounds. function saveKoordinates(bounds) { try{ urlCall = libraryRoot+"/jscalls/rememberBounds.php?type=koordinates&sw="+bounds.getSouthWest()+"&ne="+bounds.getNorthEast()+"¢er="+bounds.getCenter()+"&zoom="+map.getZoom(); $.getJSON(urlCall, function(data){ }); } catch(err) { console.log(err); } } The ajax file
slide effect using ow.trigger
$(document).ready(function() { var owl = $("#owl-demo"); var landskycarouseleffect = $.noConflict(); /** value of slide image **/ var fornexteffect =5000; var previouseeffect =5000; var playeffect = 1000; owl.owlCarousel({ //10 items above 1000px browser width items : 10, //DESKTOP itemsDesktop : [1000,5], // desktop small itemsDesktopSmall : [900,4], itemsTablet: [600,2],
Validate
Hi! I created my project in VS with MVC4. In _layout.cshtml file I added: < script src ="~/Scripts/jquery.validate.min.js"></ script > < script src ="~/Scripts/jquery.validate.unobtrusive.min.js"></ script > and it worked smooth. Then I updated the whole project via NUGET and got something like. - jquery 2.1.3(?) - jquery.validation 1.13.X - MVC 5.X.X ... all the latest. (I don't have the project in front of me, so the versions might be slightly wrong.) If I remove validation scripts the project
Loading image from directory
if there any solution, need help. The goal is to get the image in order (img01, ...img0n) each <element> get the list directory ordered but the load img dont get img ordered; is there a way to load sequentially(ordered) the list of image ? path = path.replace(file, GlobalFileImg); var extImgLow = ".jpg"; var extImgUP = ".JPG"; $.ajax({ url: path, async: false, cache: false, success: function (data) { $(data).find(('a:contains('
Anybody knows a jQuery plugin which animate/simulates an automatic demo of a website flow and functions
Hi you all !! Anybody knows a jQuery plugin which animate/simulates an automatic demo from a website flow navigation and functions? In other words: Show an automatic presentation from a website to users, without user have to do anyting manually. So: User opens site and all possible user actions which can be done, including navigate to the next pages, are playing automaticly one-by-one. I hope to get some good advise, examples and links to great jQuery plugins to use for above needs. Thanks in
jquery mobile nested listview not rendering correctly
i'm working on a jquery mobile application with 1.4.5 version I would like to load a nested listview retrieving the HTML code to a service. However nested <ul><li> not rendering correctly. They seem to have no styles But If i use the same code inside html page it works Here is my code: HTML <div data-role="main" class="ui-content"> <ul data-role="listview" data-inset="true" id="MainMenu"> </ul></div> Javascript <script type="text/javascript" charset="utf-8"> $(document).ready(function () { $.ajax({
Autocomplet
Hi friends i have a autocomplete code but i need search button to get the value in tags I need a autocomplete code with ridirect button and i want to give the tags to individual hyperlink If you r an have the Code??? But I Dont't It is possible
where do i pass the index parameter ?
hey guys i have the following HTML : <nav class="product-nav"> <ul class="nav-list-holder"> <li><a href="#overview" class="active">History</a></li> <li><a href="#quality">Quality</a></li> <li><a href="#offerings">Offerings</a></li> </ul> </nav> and the following Jquery code : $jobslist = $('.nav-list-holder a'); $($jobslist).on('click', function(e ){ // var $(me) = $(this); e.preventDefault(); var newcontent = $(this).attr('href');
jQuery animate right to left not working.
I am trying to animate an element behind a UL so that when a list element is clicked, the width of the element animates left to right to encompass the list and then readjusts to its original width. I am able to get it working for the left to right animate, but when i try to reset the Right offset to 0, it does no longer animate[from right to left]. Can someone have a look into this. Here is the link to fiddle. http://jsfiddle.net/newbie_ready_to_learn/ndme18t4/14/
Hiding text after asp.net form post submit
The following is some code I am playing around with to see if I can hide some text after an asp.net form post. I stripped out a bunch of stuff but you should get the picture. The button works but the submit does not. Does jQuery play well with asp.net? < script > $(document).ready( function () { $("button").click(function () {
$("#test").hide();
});
});
</script>
------------------------------------------------
<script>
$(document).ready(function () {
$("form").submit(function () {
$("#test").hide();
});
});
Unable to load JSON file using getJSON method
Here's my code $(document).ready(function(){ $.getJSON( "testJSON2.json", function(json){ $.each(json, function(key,value){ $("div").append( value.id ); }); }); }); testJSON2.json contents : { "p1" : {"id": "whatever", "name": "start", } } I am not sure where I am doing it wrong. I have
Jqgrid column reordering issue
I have a jqgrid with subgrid enabled. When I reorder the columns in the collapsed view with subgrid expanded, the subgrid data gets messed up. The subgrid headers stay fixed but data moves according to the collapsed view. Can anyone please help with this? If it is limitation it would be helpful if the link is provided.
Can anyone tell why is all icon is the same?
i use jQuery validation plugins for my register form and everything looks fine except the span. If i put something meet the requirement the span will automatically change and this goes for every form except username (There is a error in php i think?!). this is my jsfiddle model. And btw how can i remove the error label when the box is green. (When there is no error there is a white space) my apology my english is not that great. have a nice day
datepicker("getDate") returns "null" in Chrome
If I have the following HTML code: <div><input type="date" name="someDate" id="someDate"/></div> and the following JQuery code: $("#someDate").datepicker(); $("#someDate").datepicker("setDate", new Date()); var output = $("#someDate").datepicker("getDate"); console.log(output); I will see "null" on the console in Chrome (IE and FF will show the actual date) But if I change the HTML code for this: <div type="date" name="someDate" id="someDate"></div> then it works in all. But what is the problem in
Jquery validator
I have done jquery validator on submit button..but how to make jquery validation on normal HTML button,which will avoid form submission till form validate <html> <head> <title>Display Data In Database Using CodeIgniter</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script> $(document).ready(function(){ }); function getdata() { alert("ok"); var grade_id =1; $.ajax({ type: "POST",
Understanding $.ajax converters
Hi, I'm not sure if I understood well what converters actually do. Here's an explanation from http://api.jquery.com/jquery.ajax/ : converters (default: {"* text": window.String, "text html": true, "text json": jQuery.parseJSON, "text xml": jQuery.parseXML}) Type: PlainObject An object containing dataType-to-dataType converters. Each converter's value is a function that returns the transformed value of the response. (version added: 1.5) Concretely: converters: {
Cloning a div only half-working.
Hi, I have stumbled into a problem when cloning a div. What I want to achieve is a list of a cloned div that can output the id on a button click. Then the user can reset it where it is cloned again, but it is on the latter I have the problem. I have attached a DEMO : https://jsfiddle.net/a4poster/6oe4mgje/ The first part run fines, when you click first time it works fine but if you press 'empty again' the list is rebuilt but the is no output when you click on a item? Can anyone help me, thanks in
Obligatory scroll
Hello word ! I have question with the function ScrollTop. I have 5 div and I want to force the scroll to the next div. But i can not ! JQUERY : $(document).ready(function(){ var heightSize= $(window).height(); $("#header, #bloc1, #bloc2, #bloc3, #bloc4") .css({ "height" : heightSize, }) $(window).scroll(function () { $("html:not(:animated), body:not(:animated)").animate({ scrollTop: heightSize }) }); }) HTML : <div id="header">
Next Page