Jump to content

Search the Community

Showing results for tags 'Jquery'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start





Website URL








Found 281 results

  1. I have a piece of JQuery: $('#bkbtnHome').click(function(e){ $('div#m2Map,div#m3Map,div#m4Map,div#m5Map,div#m6Map,div#m7Map,div#m8Map').fadeOut('slow', function(){ $(".m1Details,#AlaskaMini").css("display","block"); $(".m2Details,.m3Details,.m4Details,.m5Details,.m6Details,.m7Details,.m8Details,.noQuery,li.bkbtn").css("display","none"); $('div#m1Map').fadeIn('slow'); });}); Trouble is, I have recently noticed that when I click #bkbtnHome, the div that is currently visible gets pushed down as it is fading out and the div that fades in appears above it. It's just ugly because it pushes it down for a second which actually causes my page to need a scroll bar for a second before it too disappears. Thing is, I know this only occurs because there are multiple divs "fading out" even though the rest of them are not visible. For example: div#m2Map is visible. I click #bkbtnHome. div#m2Map fades out, the other stuff changes their display, div#m1Map fades in. However, #bkbtnHome can also be clicked when div#m3Map is visible. When that too is clicked, it needs to fade out and have the same stuff change its display. Hence why I put it all together. When it is just a single item fading out, this problem doesn't occur. I am pretty sure it is because something that is already invisible is being told to fade out. My question is, what might be a better way to write this to accomplish the same task? I tried adding an if statement like this: $('#bkbtnHome').click(function(e){ if($('div#m2Map').css("display","block")){ $('div#m2Map').fadeOut('slow',function(){ $(".m1Details,#AlaskaMini").css("display","block"); $(".m2Details,.m3Details,.m4Details,.m5Details,.m6Details,.m7Details,.m8Details,.noQuery,li.bkbtn").css("display","none"); $('div#m1Map').fadeIn('slow'); }); };}); And it does work, but this would require me to write many if statements (or one with many else). Is there another approach I could take to fix this little glitch that would keep it simple/short?
  2. I was just wondering, how do you make a div, or a character run and when it comes in contact with a coin, it collects the coin? Like if mario were running and he collects a coin.
  3. Hey, so I have this simple jQuery function,but it is not working. When I click the div with the class "buttonup", the div with the class "thing" doesn't move. Can anyone tell me why this won't work? $(document).ready(function(){ $('.buttonup').click(function(){ $('.thing').animate({left: '+=10px'}, 500); });});
  4. Hi guys, So I set up a few boxes on a page and want a random one to disappear whenever any box is clicked on. I am a little rusty and was never that good at coding so this is just for fun/practice. My divs are set up as having id's square(1-18) My jquery code is: $(document).ready(function() { $("div").mouseenter(function() { $(this).animate({ height: '+=50px', width: '+=50px', fontSize: '+=100px'}); }); $("div").mouseleave(function() { $(this).animate({ height: '-=50px', width: '-=50px', fontSize: '-=100px' }); }); var num = math.floor(math.random() * 18) + 1; var n = num.toString(); var sEvent = "'" + "#" + "square" + n +"'"; $("div").click(function() { $(sEvent).toggle(400); }); }); the first 2 sections work fine but I cant get my click function to work properly. Please let me know your thoughts!
  5. Hello everyone! My name is Ron Kane and I am an accomplished web developer and technical writer having done many technical manuals, general information and "how-to"s in the Content Management field. I have significant success in utilizing the Adobe Suite and Microsoft SharePoint products with respect to creating content and following industry based style guides. My biggest success to date was working with one of my past company's Chief of Staff for a SVP in revamping their entire Intranet portal. This portal went from being unprofessional looking and having no web traffic to being very professional looking and increasing the traffic to it ten-fold. Right now, I'm reading through the HTML tutorials in preparation for my first ever HTML certification through here to gain recognition for my commitment to improving my skills and to meet with fellow web developers on here. Ask away if you have quesitons and I'm glad to be on here! Ron
  6. Hello everyone, I'm having a problem executing a function, I have now tried different methods for hours and can't understand anything anymore. Now when I execute the fuction infoApp(); in this function below, then it works. function editCat(ids){ $('.mode').hide(); $('.editmode_'+ids).show(); $('.save_category_'+ids).click(function(){ var getThisName = $('.category_'+ids).val(); infoApp('cat_edit',getThisName); }); } But when I try to execute the funtion automaticly then it does not work.Like this: var getThisName = 'test value';infoApp('cat_edit',getThisName); Here's the function function infoApp(app,usedata){ $('.infomsg').show(); if(app == "cat_edit"){ $('.infomsg').text("Information, "+ usedata +" category was saved"); } $('.infomsg').fadeOut(3600); } Hope anyone got some advice for me.Kris
  7. Hello everyone I have now worked on this trying several options for hours, I have tried tinyMCE.get('.content').getContent(); and regular jquery $('.content').val(); but it still won't work for me. I like the new look of the simple version of tinyMCE so I hope I won't have to give it up just yet! I'm retriving it for saving as: var content = $('.content').val(); I tried to retrive the data from the iframe that tinyMCE makes itself, but that would not work either.. But I might have done it wrong. Hope someone can help me out! Kris
  8. I Am Creating A iOS WebApp [ StandAlone] Which Looks Like A iOS Application The Only Difference That It Written In HtmlAnd JavascriptWhen You Go To A Website and click on add to home screen it creates an icon with the site content [webclip] i have created a website and i need help with one little detail i found that script in my site it permit all links to open in the webapp i was trying to make the links open in safari but when i manage to do that, the navigation menu doesn't work could any one help me please ?heres the code Detect if iOS WebApp Engaged and permit navigation without deploying Safari (function(a,b,c){if(c in b&&b[c]){var d,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"in d&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)},!1)}})(document,window.navigator,"standalone") i need to open the links in safari rather than the webapp thats it
  9. I want to create a main header where texts will bounce in, in 0.5s intervals and then at the same time it will all fade out, 1s interval again then new text will bounce in same intervals again and fade out. When it finished I want it to start from the beginning. I use animate.css, twitter-bootstrap and jquery. I have tried a few different ways, but so far I couldnt even get it to fade out after a short delay or if it fades out, it wont bounce in. http://erotikus-munka.co.uk/test/index2.html $( document ).ready(function() { $( '.main2' ).addClass( 'bt_visible animated fadeInDownBig'), $('.main2').addClass(3000, 'animated fadeOutDownBig')});$( document ).ready(function() { $( '.main2' ).addClass( 'bt_visible animated fadeInDownBig'); $( ".main2" ).toggle( "puff" ).delay(3000);});$( document ).ready(function() { $( '.main2' ).addClass( 'bt_visible animated fadeInDownBig'); $( ".main2" ).removeClass( 'bt_visible animated fadeInDownBig').delay(3000); $( '.main2' ).addClass( 'bt_visible animated fadeOutDownBig').delay(3000);});
  10. Hi All, Could you guys suggest how to call a function to resize fieldsets to equal height when the validation plugin puts an error message? I have a fancy form made of 3 fieldsets side by side, and a simple code makes their height equal. It goes like this: function eqHgt(){ var hght = 0; $('.column').each(function() { // all fieldsets have 'column' class if($(this).height() > hght) { hght = $(this).height(); } }); $('.column').height(hght);} The form is validated by the jQuery Validation plugin. The problem is that when the plugin finds some invalid fields, it puts error messages in label elements under those fields and the content of the fieldset overflows. It would make the wrapping fieldset one or more lines higher, but it can't grow because my function eariler gave a fixed height to all the 3 fieldsets. In this situation it's useless if I run the eqHgt again because it looks for the tallest element without avail. I tried to put a new line into my eqHgt function immediatelly after the 3rd line ($('.column').each...): $('.column').height('auto'); ...so in my logic it would let the fieldsets to grow to the size their content dictate and then record the new size but it doesn't work. I must say I have no idea why. Maybe the problem is that I bound eqHgt to an improper event. I tried to use #myform.change, .column.change and in invalidHandler function of validation plugin. Your help would be highly appreciated.
  11. Hallo all, I have a problem that I hope someone can help me with. I am using the Intel XDK with jQuery and Cordova. I do not unfortunately know which versions they are because I can't see it but the XDK has just update so I believe it is the newest versions whatever they are. I added a html file that I am working with at the moment to read a text file and eventually save to a database but for now to get it working I just want to place the contents in a div. I am using an input type="file" as below to select the file from the directory. <input class="wide-control" placeholder="Text File" type="file" name="txtFile" id="txtFile"> My code is in the index.html file (attached) and the input and div is in the other html file. My problem is lying where I get the file. I have put alerts before and after and I also have two versions of reading the file. the readText function is doing the jQuery.get or at the moment $.get and just absolutely nothing happens. The readFile function gives me an error: Uncaught TypeError: Cannot read property '0' of undefined index.html line 143. var Importer = { init: function() { var me = this $("#btnImport").bind("tap", function(e) { //me.readText() me.readFile() }); }, readText: function() { if (window.File && window.FileReader && window.FileList && window.Blob) { var myfile = $("#txtFile").val() var isAbs = $.mobile.path.isAbsoluteUrl(myfile); alert("Abs URL: " +isAbs); alert(myfile); $.get(myfile.file[0], function(data) { alert("$.get") //var myvar = data; //var myline = data.replace(/n/g,"<br />") //alert(myline); //$('#filecontents').html(data.replace(/n/g,'<br />')); }); } else { alert("Files are not supported"); }; }, // readtext readFile: function() { if (window.File && window.FileReader && window.FileList && window.Blob) { var fileSelected = $('#txtFile').val(); alert(fileSelected); var fileExtension = /text.*/; alert(fileExtension); var fileTobeRead = fileSelected.files[0]; if (fileTobeRead.type.match(fileExtension)) { var fileReader = new FileReader(); fileReader.onload = function (e) { var fileContents = $('#filecontents'); fileContents.innerText = fileReader.result; } fileReader.readAsText(fileTobeRead); } else { alert("Please select text file"); } } else { alert("Files are not supported"); }; } // readfile } //importer index.html
  12. In my previous question I managed to solve a way to load an external php file into my html thanks to your help. The php file loads perfectly fine as long as it follows the simple to criteria to load php after a given amount of time, which in my case is 1000 milliseconds. I wanted to know a method which loads data from the php file ONLY, and ONLY if the data in that php file has changed. My script what I managed to do after hours of research looks like follows: <script type="text/javascript">$(document).ready(function () { var auto_refresh = setInterval( function () { function testing() { var result = null; var scriptUrl = "http://localhost:8888/test-site/wp-content/my-php-files/test-check.php"; //Use this php file (NB: This file contains the same data as "test.php") as a check if data changed or not. $.ajax({ url: scriptUrl, type: 'POST', // I tried "GET" as well dataType: 'html', success: function (data) { result = data; } }); return result; } databaseData = testing(); currentData = $('#demo').html(); if (databaseData != currentData) { // I compare the values from the Ajax request and the value currently in my div to see if they are similar or not. $('#demo').fadeOut('slow', function () { // I added fadeOut and FadeIn effect for the div to load when data has changed $('#demo').load('http://localhost:8888/test-site/wp-content/my-php-files/test.php', function () { $('#demo').fadeIn('slow'); }); }); } }, 1000);});</script><div id="demo"></div> In this case scenario, the problem is that the div is loaded every second with the fadeIn and FadeOut effect although the data has not changed. Precisely, the same value appears even up to ten times with the effects even if it is the same value the whole time. It does not matter, if the value is altered or not, the div will be refreshed anyway. The php file contains some data (to pe precise prices) that are refreshed in a random amount of time (it can be 1 second, 10 seconds, 1 minute, etc; this is uncertain). Is there a way to compare the data in "test.php" and if it is not the same, upload the div with the new content? Thanks once again!! This forum always gives great support and positive feedback.
  13. i want to recreate a jquery of the home banner http://manoharart57.wix.com/purple-pr Help Appreciated!
  14. This would be quite a simple issue for someone more experienced: (I have just begun with Jquery and Javascript)I have coded a really simple HTML, CSS, Jquery animation.. The ball <div> moves from side to side (Pretty Damn COOL!) BUT... I need to try and trigger the animation with scrolling, basically creating a 'Pong' game. From one side of the scren to the other. HOW do I do this? I have been trying to find a sollution online and can't. Please help, or I will find you and kill you. <!DOCTYPE html><html> <head> <title> Pong </title> <style type="text/css"> .pong{ position: relative; border-radius:100%; top:250px; float:left; z-index: 1; width: 100px; height: 100px; transition-property: transform, -webkit-transform; transition-duration: 0.2s; transition-timing-function: ease-out; background-color:#FFF700; } #stage{ min-height:500px; min-width:500px; background-size:cover; } </style> <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> <script type="text/javascript"> $(document).ready(function () { move(); }); function move() { $(".pong").animate({ left: 900 }, { duration: 5000, complete: function () { $(".pong").animate({ left: 40 }, { duration: 5000, complete: function () { move(); } }); } }); } </script> <script type="text/javascript"> </script> </head> <body> <div class id="stage"> <div class="pong"> </div> </div> </body></html> any help would be greatly appreciated.
  15. Hello, i'm wondering how my contact form requires 2 form submits until it actually submits the data. (Fill it with fake data example blaablaa@bla.com & such on to see) Preview: http://mudsaf.info/contact.php
  16. Linked is my website that I have been working on and off for awhile. As you can see the image is not inline with the title, I realise this is probably a jquery issue that I am just not getting. Can anyone advise me on the correct tag or class I should be applying to have it inline with the title. Thank you http://mrt.guardian1.com.au:57005/test/index.php
  17. Hi All, I posted a thread previously which was answered pretty well so thought I would try my luck again, I am creating a logon page for my company, the logon page will be mostly used by mobiles and ipads so I have had to learn alot (imo) about mobile sites, so excuse me if I have failed in some respects haha. The website below is my test site and what I am hoping to have achieved is to have the logon keypad dynamically shape depending on browser window, i.e a mobile is smaller than an ipad. The goal then is to have the buttons also become larger and smaller. Is this even possible? If it is not possible can someone let me know how I can actually make the keypad larger so at least it will look the part on an ipad. Any help is appreciated, thanks. http://mrt.guardian1.com.au:57005/test/patrols.html
  18. I want to create a div and set the opacity to 0 with css(background, color, border) so completely invisible and the whole thing will only work if js enabled. There is another div next to it, and want to use jquery to change the opacity to 1 and change it size. If possible with fadeIN fadeOut. So far i didnt get far, still couldnt even change the opacity, although a researched it. Also I tried mouseenter and mouseover, but no luck yet or to use .hover to create a new div and everyting, but than I need the rest of the page to stay where it is and a new div would change it.. $(document).ready(function(){$("#showCaseWD").hover(function(){$("#wdShow").css({color:rgba(0,0,0,1.0)});});});
  19. Auction Ima wants to raise funds by running auctions online so every senior member has a chance to bid The auction: Must enable only administration to upload articles for auction and only senior members to bid. Must notify members of their bid and also when another member has outbid them Must be time limited i.e. an ending date/time to the auction can be set. Should have a buy it now functionality which, when used, ends the auction. Could enable bids to be withdrawn (with all appropriate notifications to members and calculations).
  20. Hope I explain this well enough for people to understand what am trying to do. Am mostly a PHP developer and use mySql for database storage, so out of my element here. I am working on a wrestling game and think I mostly got it worked out, however am struggling on "match countdown times" I been Google searching on countdown timers and did suspect, that javascript would be needed and possible ajax. There going be 2 to 4 players and each player will have a certain time before being counted out. When the match is setup by someone, they can select from a variety off options for match length, 5mins, 1 day, 3 days, 5 days, 7 days etc. Am trying to find a way to store a timer for each player in a database table, then output it on a page and show the time remaining for the player. lol I realize it not exactly an easy thing am trying to do, but really am at a lose on where to start here. So any advice anyone can give me will be greatly appreciated. I do need a way to convert the variables with the timer information over to PHP though.
  21. Guys, good morning. I need a huge favor, http://ikoeh.com/arkpad/decoracao/tenha-orquideas-de-inverno-no-jardim-veja-12-especies/ this link has a photo gallery, and at the top, the small images, and wanted to make a horizontal scrolling thumbnails, the larger picture, when the person clicks and view the 8th picture, in miniature, no wheel well. Can anyone help me? Actually, this gallery would have to look like or exactly like this: delas.ig.com.br/casa/decoracao/2013-07-01/ideias-para-decorar-o-quarto-do-casal.html Please, someone help me.
  22. I have this html/javascript +jquery code, which is meant to compile my code, but i dont know how to read the javascript as a code.//the code<!DOCTYPE html><html><head><script src="jquery.js"></script><script async>window["logerrors"] = function(){var script = $("script#val").text().replace(/[n]/ig,"};");var reps = script.replace(/};/ig,"~");var eachLine = reps.split("~");var errors ="";var err = [];for($i=0;$i<eachLine.length;$i++){try{new Function(eachLine[$i])();err.push("no");continue;} catch(e){errors += "Scope Number: "+ Number($i+1) +"<br>"+e + "<br><span style='color:red;white-space: pre'>"+eachLine[$i]+"</span><hr>";err.push("yes");continue;}}if(err.indexOf("yes") > -1){$("body").html(errors);} else{return true;}}</script></head><body onLoad="logerrors()"><script id="val">var i = jQuery;while(!i){var i = jQuery;}phrompt(i.fn.jquery);ro(q);//the while loop is an example, the code reads it as "while(){"</script></body></html>
  23. Hi, what is the 'q' thing in this PHP AJAX tutorial: http://www.w3schools.com/php/php_ajax_php.asp : HTML page: xmlhttp.open("GET","gethint.php?q="+str,true); PHP file: $q=$_REQUEST["q"]; And how PHP read value of an input element (html) to be processed? The same question if using jquery AJAX.. I'm learning XMLHttpRequest and trying to figure out how PHP get data value from HTML element to be processed. I don't know anything about PHP, I've just started a start. Thanks!
  24. In trying to make a "talkbubble" styled div- box change colors completely upon being clicked, I ran into a problem of getting the :before pseudo element that I'm using (to shape the arrow for the talkbubble) to actually change colors with the rest of the element. My script is http://jsfiddle.net/petiteco24601/3xuuq2fx/. When I couldn't get it to work, I did some research and it seems what/how to control pseudo-elements is a question that most web developers seem shaky about. For the most part, a lot of what I found was basically saying that there's no way to really force javascript on a pseudo element, since the pseudo element doesn't REALLY exist. However, with more research, I found things like http://css-tricks.com/pseudo-element-animationstransitions-bug-fixed-in-webkit/ andhttp://stackoverflow.com/questions/2610497/change-an-inputs-html5-placeholder-color-with-css/2610741#2610741 that say that those bugs were fixed and it is possible with some browsers to use javascript on pseudo elements. What's the actual deal? How extensively can a person control pseudo elements?
  25. Admittedly I'm fairly new to Javascript, but I've taken numerous tutorials, classes, and have searched for hour online and I can't seem to figure out how to make my script work, and have edited it and edited it so many times I just want to start over. What I'm trying to do is, when one of six divs is clicked, a separate div will have 3 specific divs appear in it. Each of the original six divs have three similar but different divs related to it. I have this much, but as I've said I've looked through so many tutorials that I just scrapped loads.http://jsfiddle.net/petiteco24601/hgo8eqdq/ $(document).ready(function () {$(".talkbubble").mouseout(function(){$(".sidebar").show();});$$(".talkbubble").click(function(){$ How do I make it so that when you click a "talkbubble" div, a different "sidebar" div appears with all its contained elements, and when you mouseout, the first talkbubble div automatically activates?
  • Create New...