Jump to content

Search the Community

Showing results for tags 'JQuery'.

  • 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


  • Community Calendar

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start





Website URL








  1. I've got the simple code to write out the text of the new position of the div: var posTeller = $('.movingDiv').position();$('span').text(posTeller.left) $(".buttonClass").click(function(){ $(".movingDiv").animate({left: '+=20'}, 500,function() { posTeller = $('.movingDiv').position(); $('span').text(posTeller.left); });}); However, I would like to have it update as it's moving. I will need this later so that an 'if' function can catch it at a certain value and stop the animation mid-way and call a new animation. I found the $.throttle plugin but I'm unsure how to implement it based off the examples. The end purpose is preventing a slide of thumbnails from going too far and 'bouncing back'. Throttle Plugin Thanks!
  2. hey all, im really new to this and could really do with some help, it would be hugely appreciated!i have a toggle type setup for a list of live events but i cant seem to find an easier way or cleaner way to use it, any ideas? here is the code im using at the moment, sorry in advance for the way this is done! i need the setup to have neat slide down tables of info. Code as follows: <script type="text/javascript">// <![CDATA[var Current = "Div1";function Toggle(obj) {if(Current != obj) {document.getElementById(Current).style.display = "none";document.getElementById(obj).style.display = "block";Current = obj;}}// ]]></script><p style="text-align: center;"><em><strong><span style="background-color: #ffffff;"><a href="#" onclick="Toggle('Div1'); return false;"><span style="background-color: #ffffff;">Monday</span></a> | <a href="#" onclick="Toggle('Div2'); return false;"><span style="background-color: #ffffff;">Tuesday</span></a> | <a href="#" onclick="Toggle('Div3'); return false;"><span style="background-color: #ffffff;">Wednesday</span></a>| <a href="#" onclick="Toggle('Div4'); return false;"><span style="background-color: #ffffff;">Thursday</span></a>| <a href="#" onclick="Toggle('Div5'); return false;"><span style="background-color: #ffffff;">Friday</span></a> | <a href="#" onclick="Toggle('Div6'); return false;"><span style="background-color: #ffffff;">Saturday</span></a> | <a href="#" onclick="Toggle('Div7'); return false;"><span style="background-color: #ffffff;">Sunday</span></a></span></strong></em></p><div id="Div1" style="display: none;"><table border="0" rules="all" align="center"><tbody> For some reason when i click monday it actually does nothing, but if i click tuesday, then monday the info is there??
  3. Hello,I'm using this script right now:mainpage.php <?php$mainpage = 'secret';?><a href="#" id="renamegroups">Rename groups</a><div id='renamegroupsl'></div> <script type="text/javascript">$('#renamegroups').click(function(){ $("#renamegroupsl").load("../information/renamegroups.php"); return false;});</script> renamegroups.php <?phpecho $mainpage;?> The problem is that I get this error:Notice: Undefined variable: mainpage in (...)So how could I include a file with ajax / jquery (because if I include the file this will work and the error won't show up) Thanks!
  4. Whats the best solution for completing this:http://app4.websitetonight.com/projects/2/3/9/4/2394058/Tools_for_Web_Success2.htmlthe website I'm working on.scroll down a bit and click the H4 there's a hidden content that slides out.but when multiple on page, it unfolds them all. whats my best option.the reason it opens both is because their both set to the same ID's. and i know that if i set all divs different ID's it will work. BUT what are my other options? are there any other options?here's the code:http://jsfiddle.net/attilahajzer/zx2dk/2/Please Help.
  5. Hi, I am trying to create a rollover fade effect for images on my page here: http://acq.matthewboehler.com/test.php. The large kitchen image does the rollover right now. I found the rollover fade script online, and it places one image on top of the other. If you shrink your browser, you'll see the images do not stay on top of each other. In Firefox, the original image is moved up. In Internet Explorer, it places the rollover image directly below the original image. In Safari, it works perfect, exactly how it should. Is it possible to put a container around the images so they stay in place, like in Safari? I've tried putting a div tag around the image, making the max-width 100%; max-height 100%, but that did not work. Any help you can offer is greatly appreciated.
  6. Randomishlying


    Is it necessary to have a knowledge of JavaScript before diving into jQuery? It's my impression that jQuery is just a JavaScript library. If that's the case, shouldn't it be just as easy to learn JavaScript that way.To those who have used jQuery, I have a few questions if you don't mind. How does one access the jQuery library? More specifically... How do I know what is in the library so that I can use it (I'm assuming it works this way, but maybe not)? How does jQuery greatly simplify JavaScript programming in your opinion? Any help would be great.
  7. Hey all! I was wondering what the method would be to grab the element above an elements text would be or if its possible? <div id="content1" style="display:none;">Hello World</div><div id="clickme"></div> The reason I need to get the element above's text is I am already getting different information from "clickme"'s child elements... So in other words I can't nest "content1" inside of "clickme" so the whole next() and prev() methods won't work for my application. Thanks so much!
  8. Ok, first let me explain what I try to do. I have a menu with some items containing a submenu. The submenu's should open when a parent is clicked and contains submenu's, and when traveling to another page (from the item clicked, for example a parent of submenu item), the submenu should remain active and visible. Now when I click on a parent item the submenu quickly blinks but is closed even as fast as it opens. I want the submenu to remain open when clicked on a parent that has a submenu, so users can easily navigate. So, here is the code I have so far: <div id="topnav"> <ul> <li> <a href="index.html">Home</a> </li> <li> <a href="#">Over Meves</a> <ul class="submenu"> <li><a href="#" class="suba">Historie</a></li> <li><a href="#" class="suba">Onze mensen</a></li> <li><a href="#" class="suba">Werkzijze</a></li> </ul> </li> <li> <a href="vervolg3.html">Disciplines</a> <ul class="submenu"> <li><a href="vervolg.html" class="suba">Klimaatbeheersing</a></li> <li><a href="#" class="suba">Elektrotechniek</a></li> <li><a href="#" class="suba">Sanitaire techniek</a></li> <li><a href="#" class="suba">Energiebesparingstechniek</a></li> <li><a href="#" class="suba">Bouwfysica en geluid</a></li> <li><a href="#" class="suba">Diensten energiebesparing</a></li> </ul> </li> <li> <a href="#">Expertise</a> <ul class="submenu"> <li><a href="#" class="suba">Woningbouw & Utiliteit</a></li> <li><a href="#" class="suba">Zorg & Welzijn</a></li> <li><a href="#" class="suba">Milieu & Energie</a></li> <li><a href="#" class="suba">Beheer & Onderhoud</a></li> <li><a href="#" class="suba">EPA & EPC</a></li> <li><a href="#" class="suba">Legionella beheersing</a></li> </ul> </li> <li> <a href="#">Contact</a> <ul class="submenu"> <li><a href="#" class="suba">Adres & route</a></li> <li><a href="#" class="suba">Werken bij</a></li> </ul> </li> </ul> </div> The javascript: var ddmenuitem = 0;function jsddm_open(){ jsddm_close(); ddmenuitem = $(this).find('ul.submenu').css('display', 'block');}function jsddm_close(){if(ddmenuitem) ddmenuitem.css('display', 'none');}$(document).ready(function(){ $('#topnav > ul > li').bind('click', jsddm_open) $('#topnav ul li a.suba').click(function(e){ if ($(this).attr('class') != 'active'){ $('#topnav ul li a.suba').removeClass('active'); $(this).addClass('active'); } }); $('a').filter(function(){ return this.href === document.location.href; }).addClass('active') $("ul.submenu > li > a").each(function () { var currentURL = document.location.href; var thisURL = $(this).attr("href"); if (currentURL.indexOf(thisURL) != -1) { $(this).parent("ul.submenu").css('display', 'block'); } });}); And the css: #topnav ul{list-style: none;padding: 0;margin: 0;}#topnav ul li{float: left;margin: 0;padding: 0;}#topnav ul li a{padding: 5px 15px;color: #00537F;text-decoration: none;display: block;font-weight: bold;}#topnav ul li a:link{color: #FFF;text-decoration: none;}#topnav ul li a:visited{color: #FFF;text-decoration: none;}#topnav ul li a:hover{color: #FFF;text-decoration: underline;}#topnav ul li a.active{text-decoration: underline;color: #FFF;}/*#topnav ul li:hover .submenu{display:block;}*/#topnav ul li ul.submenu{float: left;padding: 4px 0;position: absolute;left: 0;top: 24px;display: none;background: #e0e0e0;color: #00537F;}#topnav ul li ul.submenu a{display: inline;color: #00537F;padding: 4px 8px;}#topnav ul li ul.submenu li{border-right-width: 1px;border-right-style: solid;border-right-color: #00537F;}#topnav ul li ul.submenu li:last-child{border-right-style: none;}#topnav ul li ul.submenu a:link{color: #00537F;}#topnav ul li ul.submenu a:visited{color: #00537F;}#topnav ul li ul.submenu a:hover{text-decoration: underline;color: #00537F;}#topnav ul li ul.submenu li.active{text-decoration: underline;color: #00537F;}#topnav ul li ul.submenu a.active{text-decoration: underline;color: #00537F;}
  9. Hi, I am busy testing out a lightbox form that I'm working on and I've got all to work except the "success" or "thank you" page.Basically I want the user to fill in the online form and when the they are click 'submit', the "thank you" message or page resolves in the same lightbox that the form was in. Go to www.testing123.co.za/test.htm and click on that link you see saying "AJAX SuperBox".The lightbox is opening up an HTML page within in the test.htm page (basically acting like an iFrame?).When I click submit, the page resolves to the success.htm page (which it should) but not in the lightbox frame. I don't want visitors to leave the test.htm page. My headers at the bottom of my process php form shows as: '; $headers = "From: $from\r\nBCC:{$bcc}\r\n"; $headers .= "Content-type: text/html\r\n"; $success = mail($to, $subject, $sBodyNew, $headers); header('Location: http://www.testing123.co.za/success.htm'); ?> I assume the Location url above needs code added to it so that it works within the lightbox? Or is there an easier way to do this? Thanks guys!
  10. Hi guysI am working on something tricky about display an image under the date text inside the cell in jquery calendarI don't mind about the plug-in of Jquery, My question is how we can assign a certain data for a cell date in the calendar assuming I have an array of values from the database and I want to assign each array element for a specific date? any idea?thanks in advance for any help
  11. Here is the location of the comments I need help with on my scrap Blogger/blogspot blog. I'm trying to move the replies under the ones they reply to. 1. I want to move the reply starting from the <li> node it is in, then 2. place it in a <ul> tag with the class "children" inside of the <li> node of which the comment replies to 3. I also want to remove the <a>reply</a> from the moved comment(s) Help me please
  12. Hey guys! Btw, great new look Okay, I have a problem that I fear cannot be resolved.I would simply like confirmation of this. My site makes use of jQuery and the LavaLamp effet for the menu.You can check it out here. My problem is this: the portfolio section is basically a jQuery slideshow, with fading transitions and such.We're still good. The problem comes when I add an animation the the background image.The slideshow becomes choppy whenever the user moves his mouse. Am I coding in a non-efficent way?Or is this just a normal jQuery limitation? Thanks.
  13. I'm new to this forum, and new to web designing in general. I'm in the final stages of completing my first website, but cannot seem to overcome this one issue that has been bugging me for a couple of days now. The problem is that I don't know how to get all the images used throughout the entire website to preload while the index page loads. Each one of my web pages has a full screen background image that I accomplished using the supersized jquery plugin. When I go to each page in my website, there is a delay as the background image loads, but the the foreground images load quickly. So how do I prevent this image loading delay everytime I move to a new page? I also thought about delaying the entry of the foreground images using .delay and .fadeIn, but the timing is not always right and I can't get the foreground images to fadeIn only after the supersized image has fully loaded. I've searched many forums, but I have yet to find a reasonable explanation that works for what I am trying to do. thanks
  14. Hi, I am currently rewriting the user interface of my site in JQuery and making the pages dynamic so that no page loads are required as the content is loaded using HttpRequests through JQuery's .load() function. This is working well, however often the content will contain some javascript code blocks relevant to that specific page. Everytime the content is loaded through JQuery, the blocks are added to the cache, even if the content has already been loaded. Therefore after navigating around the site for a while, the javascript processing gets slower and slower, presumably due to the increase in the amount of script loaded. Is there any way around this problem? Such as by clearing the script cache? Or naming my script blocks so the page knows that it has already been loaded? Thanks for reading.Duncan
  15. Here is source:<!DOCTYPE HTML><html lang="en"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>JQuery for Dummies</title><style type="text/css">.centerimage { width: 300px; height: 300px; position: absolute; left: 50%; top: 50%; margin-left: -150px; margin-top: -150px;}</style> </head><body><img src="media/images/image.jpg" height="28" width="28" alt="This is an image" /></body><script type="text/javascript" href="media/js/jquery-1.5.2.min.js" > </script><script type=”text/javascript”>$(document).ready(function(){ alert(jQuery('img').attr('alt')); });</script></html> All the js, css,and images are loading correctly. Why can't I see any prompt box? Another question, if I add class="centerimage" inside the img then browser neglects the height and width
  • Create New...