Search Results

Search found 15860 results on 635 pages for 'document oriented databas'.

Page 603/635 | < Previous Page | 599 600 601 602 603 604 605 606 607 608 609 610  | Next Page >

  • display image and run script for fifteen seconds

    - by Ryan Max
    This is very similar to a question I asked the other day but my page code has become significantly more complicated and I need to revisit it. I've been using the following code: $('#myLink').click(function() { $('#myImg').attr('src', 'newImg.jpg'); setTimeout(function() { $('#myImg').attr('src', 'oldImg.jpg'); }, 15000); }); To replace an image for a set period of time (15 seconds) when the link is clicked, then after 15 seconds, revert to the original image. However now, I'd like to run a snippet of javascript as well when the link is clicked (in addition to replacing the image), and only when the link is clicked (it's related to the 15 second image) and then have the js code disappear as well after the 15 seconds...however I'm not sure how to have jquery send js code into the page...Basically I just want jQuery to "echo" this code onto the page underneath the 15 second while I am there, but I don't know how jquery formats this "echo". Does this question make sense? interval = 500; imgsrc = "webcam/image.jpg"; function Refresh() { tmp = new Date(); tmp = "?" + tmp.getTime(); document.images["image1"].src = imgsrc + tmp; setTimeout("Refresh()", interval); } Refresh(); It's script for a webcam. Basically it takes a new picture every half a second and replaces it on the page. You must forgive me, I'm new to jquery, I don't know how to make this script work in a jquery context. i'm sorry, I'm explaining badly. This is what I need to happen, step by step: 1) User comes to the page and there is a static image that says "Click here to view webcam" 2) User clicks image 3) Image is replaced by live webcam image, which is refreshed every .5 seconds by the second script in my question. 4) After 15 seconds the live webcam reverts back to the static image saying "click here to view webcam" It is ONLY during that 15 second interval that I wan the webcam refresh script running, otherwise it's wasting bandwidth on an element that isn't even shown. Sorry for the confusion.

    Read the article

  • Make a table start on the same line as header

    - by ripper234
    I am trying to get a table of icons appear on the same line as the header. In the HTML below, the icons appear on a separate line. I tried using 'top' attribute to move the table, but this is not a good solution because then there's an ugly space between the icons table and the rest of the document. How can I fix this? <html> <head> <style type="text/css"> #action-icons { float:right; position:relative; border:0; } </style> </head> <body> <h1 class="edit">Bla bla</h1> <table id="action-icons"> <tbody> <tr> <td><img width="64" height="64"/></td> <td><img width="60" height="60"/></td> </tr> <tr> <td><img width="36" height="36"/></td> <td><img width="36" height="36"/></td> </tr> </tbody> </table> <table width="100%" class="tasksgrid"> <tbody> <tr> <th class='taskcell'>One</th> <th class='taskcell'>Two</th> </tr> </tbody> </table> </body> </html>

    Read the article

  • Google Maps and jQuery Tabs

    - by Dom
    Hello All, I have slight problem with Google maps included in simple jQuery Tabs. Below I pasted the code: jQuery: $(document).ready(function() { //Default Action $(".tab_content").hide(); $("ul.tabs li:first").addClass("active").show(); $(".tab_content:first").show(); //On Click Event $("ul.tabs li").click(function() { $("ul.tabs li").removeClass("active"); $(this).addClass("active"); $(".tab_content").hide(); var activeTab = $(this).find("a").attr("href"); $(activeTab).fadeIn(); return false; }); }); Here is the HTML for the tabs: <div class="bluecontainer"> <ul class="tabs"> <li><a href="#tab1">Tab1</a></li> <li><a href="#tab2">Tab2</a></li> <li><a href="#tab3">Tab3</a></li> <li><a href="#tab4">Tab4</a></li> </ul> <div class="tab_container"> <div id="tab1" class="tab_content"> <h2>Tab1</h2> </div> <div id="tab2" class="tab_content"> <h2>Tab2</h2> </div> <div id="tab3" class="tab_content"> <div>google Map</div> </div> <div id="tab4" class="tab_content"> <h2>Tab4</h2> </div> </div> </div> I really don't know what to do to. Is that a general problem with google maps or there is something with my tabs? But they are working just fine with everything else. Thank you for your help in advance

    Read the article

  • Router Alert options on IGMPv2 packets

    - by Scakko
    I'm trying to forge an IGMPv2 Membership Request packet and send it on a RAW socket. The RFC 3376 states: IGMP messages are encapsulated in IPv4 datagrams, with an IP protocol number of 2. Every IGMP message described in this document is sent with an IP Time-to-Live of 1, IP Precedence of Internetwork Control (e.g., Type of Service 0xc0), and carries an IP Router Alert option [RFC-2113] in its IP header So the IP_ROUTER_ALERT flag must be set. I'm trying to forge the strict necessary of the packet (e.g. only the IGMP header & payload), so i'm using the setsockopt to edit the IP options. some useful variables: #define C_IP_MULTICAST_TTL 1 #define C_IP_ROUTER_ALERT 1 int sockfd = 0; int ecsockopt = 0; int bytes_num = 0; int ip_multicast_ttl = C_IP_MULTICAST_TTL; int ip_router_alert = C_IP_ROUTER_ALERT; Here's how I open the RAW socket: sock_domain = AF_INET; sock_type = SOCK_RAW; sock_proto = IPPROTO_IGMP; if ((ecsockopt = socket(sock_domain,sock_type,sock_proto)) < 0) { printf("Error %d: Can't open socket.\n", errno); return 1; } else { printf("** Socket opened.\n"); } sockfd = ecsockopt; Then I set the TTL and Router Alert option: // Set the sent packets TTL if((ecsockopt = setsockopt(sockfd, IPPROTO_IP, IP_MULTICAST_TTL, &ip_multicast_ttl, sizeof(ip_multicast_ttl))) < 0) { printf("Error %d: Can't set TTL.\n", ecsockopt); return 1; } else { printf("** TTL set.\n"); } // Set the Router Alert if((ecsockopt = setsockopt(sockfd, IPPROTO_IP, IP_ROUTER_ALERT, &ip_router_alert, sizeof(ip_router_alert))) < 0) { printf("Error %d: Can't set Router Alert.\n", ecsockopt); return 1; } else { printf("** Router Alert set.\n"); } The setsockopt of IP_ROUTER_ALERT returns 0. After forging the packet, i send it with sendto in this way: // Send the packet if((bytes_num = sendto(sockfd, packet, packet_size, 0, (struct sockaddr*) &mgroup1_addr, sizeof(mgroup1_addr))) < 0) { printf("Error %d: Can't send Membership report message.\n", bytes_num); return 1; } else { printf("** Membership report message sent. (bytes=%d)\n",bytes_num); } The packet is sent, but the IP_ROUTER_ALERT option (checked with wireshark) is missing. Am i doing something wrong? is there some other methods to set the IP_ROUTER_ALERT option? Thanks in advance.

    Read the article

  • Jquery Content Cycle Next/Previous not working

    - by user340745
    I have a definition list with a lot of text inside of it. When a user comes to the page, I want the jQuery to hide two thirds of that content, add a next and previous button where appropriate, and fade the content in and out. The first third of the content is .issue-group-1, the second third is .issue-group-3, the third, .issue-group-3. I am trying to set it so that when the user hits the next button, the next button changes classes, and thus acts differently the next time the user clicks it (that is, it takes them to the third page instead of the second. Right now, the next/previous buttons are working on the first and second "pages" but the next button to the third page won't work. My code is probably too long and this is maybe not the best way to do it--I'm new to jquery. Any suggestions would be helpful. $(document).ready(function(){ $('.issue-group-2, .issue-group-3').hide(); $('a#next-button.page1').fadeIn(500); $('a#next-button.page1').click(function() { $(this).removeClass('page1').addClass('page2'); $('.issue-group-1').fadeOut(500, function() { $('.issue-group-2').fadeIn(500); }); $('a#previous-button').fadeIn(500); }); $('a#previous-button.page2').click(function() { $('#next-button.page2').removeClass('page2').addClass('page1'); $('.issue-group-2').fadeOut(500, function() { $('.issue-group-1').fadeIn(500); }); $('a#previous-button').fadeOut(500); }); $('a#next-button.page2').click(function() { $('a#previous-button').removeClass('page2').addClass('page3'); $('.issue-group-2').fadeOut(500, function() { $('.issue-group-3').fadeIn(500); }); $('a#next-button').fadeOut(500); }); $('a#previous-button.page3').click(function() { $(this).removeClass('page3').addClass('page2'); $('.issue-group-2').fadeOut(500, function() { $('.issue-group-2').fadeIn(500); }); $('a#next-button').fadeIn(500); }); });

    Read the article

  • JavaScript Coding for Finding Shipping Total

    - by user2913279
    I am having a very hard time with this code. I have been working on it for days and cannot seem to figure it out. Please help!! Here are the specific I need for the code: Many companies normally charge a shipping and handling charge for purchases. Create a Web page that allows a user to enter a purchase price into a text box and includes a JavaScript function that calculates shipping and handling. Add functionality to the script that adds a minimum shipping and handling charge of $1.50 for any purchase that is less than or equal to $25.00. For any orders over $25.00, add 10% to the total purchase price for shipping and handling, but do not include the $1.50 minimum shipping and handling charge. The formula for calculating a percentage is price * percent / 100. For example, the formula for calculating 10% of a $50.00 purchase price is 50 * 10 / 100, which results in a shipping and handling charge of $5.00. After you determine the total cost of the order (purchase plus shipping and handling), display it in an alert dialog box. Here is the code I have: <!DOCTYPE> <head> <title>Calculate Shipping</title> <script type="text/javascript"> function parseInt() { var salesPrice = document.salesForm.Price.value; var minCharge = salesPrice + 1.50; var shipping = salesPrice * 10/100; if (salesPrice <= 25) window.alert('Your sales total including shipping is $' + minCharge); else window.alert('Your sales total including shipping is $' + salesPrice + shipping); } </script> </head> <body> <form name="salesForm"> <div > <p>Enter Your Purchase Price</p> <input type="text" name="Price" /><br /><br /> <input type="button" name="Calculate" value="Calculate Shipping" onclick="parseInt ()" /> </div> </form> </body> </html> Everything works except for the math in the alert box. It will show an incorrect total...

    Read the article

  • JavaScript (via Greasemonkey) failing to set "title" attributes on <a> tags

    - by rjray
    I have the following (fairly) simple JavaScript snippet that I have wired into Greasemonkey. It goes through a page, looks for <a> tags whose href points to tinyurl.com, and adds a "title" attribute that identifies the true destination of the link. Much of the important code comes from an older (unsupported) Greasemonkey script that quits working when the inner component that held the XPath implementation changed. My script: (function() { var providers = new Array(); providers['tinyurl.com'] = function(link, fragment) { // This is mostly taken from the (broken due to XPath component // issues) tinyurl_popup_preview script. link.title = "Loading..."; GM_xmlhttpRequest({ method: 'GET', url: 'http://preview.tinyurl.com/' + fragment, onload: function(res) { var re = res.responseText.match("<blockquote><b>(.+)</b></blockquote>"); if (re) { link.title = re[1].replace(/\<br \/\>/g, "").replace(/&amp;/g, "&"); } else { link.title = "Parsing failed..."; } }, onerror: function() { link.title = "Connection failed..."; } }); }; var uriPattern = /(tinyurl\.com)\/([a-zA-Z0-9]+)/; var aTags = document.getElementsByTagName("a"); for (i = 0; i < aTags.length; i++) { var data = aTags[i].href.match(uriPattern); if (data != null && data.length > 1 && data[2] != "preview") { var source = data[1]; var fragment = data[2]; var link = aTags[i]; aTags[i].addEventListener("mouseover", function() { if (link.title == "") { (providers[source])(link, fragment); } }, false); } } })(); (The reason the "providers" associative array is set up the way it is, is so that I can expand this to cover other URL-shortening services as well.) I have verified that all the various branches of code are being reached correctly, in cases where the link being examined does and does not match the pattern. What isn't happening, is any change to the "title" attribute of the anchor tags. I've watched this via Firebug, thrown alert() calls in left and right, and it just never changes. In a previous iteration all expressions of the form: link.title = "..."; had originally been: link.setAttribute("title", "..."); That didn't work, either. I'm no newbie to JavaScript OR Greasemonkey, but this one has me stumped!

    Read the article

  • gauge chart is not displaying any thing

    - by Sandy
    i am trying to display the latest speed in mysql database on guage chart. i have tried so many things but gauge is not display plz any can help me...my code is attached and php part shows the correct value but dont know why guage is not display <?php $host="localhost"; // Host name $username="root"; // Mysql username $password=""; // Mysql password $db_name="mysql"; // Database name $tbl_name="gpsdb"; // Table name // Connect to server and select database. $con=mysql_connect("$host", "$username")or die("cannot connect"); mysql_select_db("$db_name")or die("cannot select DB"); $data = mysql_query("SELECT speed FROM gpsdb WHERE DeviceId=1234 ORDER BY TIME DESC LIMIT 1") or die(mysql_error()); while ($nt = mysql_fetch_assoc($data)) { $speed = $nt['speed']; $jsonTable = json_encode($speed); echo $jsonTable; } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title> Google Visualization API Sample </title> <script type="text/javascript" src="//www.google.com/jsapi"></script> <script type="text/javascript"> google.load('visualization', '1', {packages: ['gauge']}); </script> <script type="text/javascript"> function drawVisualization() { // Create and populate the data table. var data = new google.visualization.DataTable(<?=$speed?>); // Create and draw the visualization. new google.visualization.Gauge(document.getElementById('visualization')). draw(data); } google.setOnLoadCallback(drawVisualization); </script> </head> <body style="font-family: Arial;border: 0 none;"> <div id="visualization" style="width: 600px; height: 300px;"></div> </body> </html>

    Read the article

  • JQuery not copying state dropdown list 1 to DDL2 on checkbox change

    - by user1001411
    I've looked at similar posts on the subject but none of the recommended solutions have worked for me so I'm not sure where I'm going wrong. I have a billing and shipping address form with a dropdown list for the state. Upon checking/unchecking the "billing address same as shipping" everything copies over except the state dropdown list. The state dropdown list is populated from a SQLDataSource state table. Here's my code: <script type="text/javascript" language="javascript" src="../Scripts/jquery-1.4.1.min.js"></script> <script type="text/javascript"> $(document).ready(function () { $('input:checkbox[id*=chkCopy]').change(function () { if ($(this).is(':checked')) { $('input:text[id*=TextBox5]').val($('input:text[id*=TextBox1]').val()); $('input:text[id*=TextBox7]').val($('input:text[id*=TextBox2]').val()); $('input:text[id*=TextBox9]').val($('input:text[id*=TextBox3]').val()); $('input:text[id*=TextBox12]').val($('input:text[id*=TextBox4]').val()); $('select#DropDownList6').val($("select#DropDownList1").val()); $('input:text[id*=TextBox14]').val($('input:text[id*=TextBox6]').val()); } else { $('input:text[id*=TextBox5]').val(''); $('input:text[id*=TextBox7]').val(''); $('input:text[id*=TextBox9]').val(''); $('input:text[id*=TextBox12]').val(''); $('select#DropDownList6').val(''); $('input:text[id*=TextBox14]').val(''); } }); }); and here is my SQL for the DDL: <asp:DropDownList ID="DropDownList1" runat="server" DataTextField="Descr" DataValueField="ID" DataSourceID="SqlDataSource1" Width="254"> </asp:DropDownList> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ASPNETDBConnectionString1 %>" SelectCommand="SELECT * FROM [xrefState]"> </asp:SqlDataSource> the other one: <asp:DropDownList ID="DropDownList6" runat="server" DataTextField="Descr" DataValueField="ID" DataSourceID="SqlDataSource5" Width="254"> </asp:DropDownList> <asp:SqlDataSource ID="SqlDataSource5" runat="server" ConnectionString="<%$ ConnectionStrings:ASPNETDBConnectionString1 %>" SelectCommand="SELECT * FROM [xrefState]"> </asp:SqlDataSource>

    Read the article

  • How to retrieve an input's value without the browser interpreting html special entities?

    - by CaptainQwyx
    Is there a way in JavaScript or MooTools to retrieve the actual text in the value from an input element without the browser interpreting any html special entites? Please see the example included below. My desired outcome is: <div id="output"> <p>Your text is: <b>[&lt;script&gt;alert('scrubbed');&lt;/script&gt;]</b></p> </div> Note that it works if I type/copy &lt;script&gt;alert('scrubbed');&lt;/script&gt; directly into the text input box, but fails if I insert right after loading the page. <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>scrubtest</title> </head> <body id="scrubtest" onload=""> <script type="text/javascript" language="JavaScript" src="/js/mootools-core.js"></script> <input type="text" name="scrubtext" value="&lt;script&gt;alert('scrubbed');&lt;/script&gt;" id="scrubtext"/><br /> <input type="button" value="Insert" onclick="insertText();"/><br /> <input type="button" value="Get via MooTools" onclick="alert($('scrubtext').get('value'));"/><br /> <input type="button" value="Get via JavaScript" onclick="alert(document.getElementById('scrubtext').value);"/><br /> <div id="output"> </div> <script type="text/javascript" charset="utf-8"> function insertText() { var stext = $('scrubtext').get('value'); var result = new Element( 'p', {html: "Your text is: <b>["+stext+"]</b>"} ); result.inject($('output')); } </script> </body> </html>

    Read the article

  • Add a fadein fade out in jQuery, on multiple conditional statements

    - by Matthew Harwood
    Task: On click of li navigation filter show and hide content with a transitional fadein fade out. Problem I'm just guessing and checking on where to place this fadein//fadeout transition. Furthermore, I feel like my code is too inefficiency because I'm using 4 conditional statements. Would stack lead me in creating a solution to improve the overall logic of this script so I can just make a pretty transition :c? LIVE CODE jQuery Script $(document).ready(function () { //attach a single click listener on li elements $('li.navCenter').on('click', function () { // get the id of the clicked li var id = $(this).attr('id'); // match current id with string check then apply filter if (id == 'printInteract') { //reset all the boxes for muliple clicks $(".box").find('.video, .print, .web').closest('.box').show(); $(".box").find('.web, .video').closest('.box').hide(); $(".box").find('.print').show(); } if (id == 'webInteract') { $(".box").find('.video, .print, .web').closest('.box').show(); $(".box").find('.print, .video').closest('.box').hide(); $(".box").find('.web').show(); } if (id == 'videoInteract') { $(".box").find('.video, .print, .web').closest('.box').show(); $(".box").find('.print, .web').closest('.box').hide() $(".box").find('.video').show(); } if (id == 'allInteract') { $(".box").find('.video, .print, .web').closest('.box').show(); } }); HTML Selected <nav> <ul class="navSpaces"> <li id="allInteract" class="navCenter"> <a id="activeAll" class="navBg" href="#"><div class="relativeCenter"><img src="asset/img/logo30px.png" /><h3>all</h3></div></a> </li> <li id="printInteract" class="navCenter"> <a id="activePrint" class="navBg" href="#"><div class="relativeCenter"><img src="asset/img/print.gif" /><h3>print</h3></div></a> </li> <li id="videoInteract" class="navCenter"> <a id="activeVideo" class="navBg" href="#"><div class="relativeCenter"><img src="asset/img/video.gif" /><h3>video</h3></div></a> </li> <li id="webInteract" class="navCenter"> <a id="activeWeb" class="navBg" href="#"><div class="relativeCenter"><img src="asset/img/web.gif" /><h3>web</h3></div></a> </li> </ul> ps. Sorry for the newbie question

    Read the article

  • What exactly does this piece of JavaScript do?

    - by helpmarnie
    I saw this page growing in popularity among my social circles on Facebook, what 98 percent bla bla... and it walks users through copying the below JavaScript (I added some indentation to make it more readable) into their address bar. Looks dodgy to me, but I only have a very basic knowledge of JavaScript. Simply put, what does this do? javascript:(function(){ a='app120668947950042_jop'; b='app120668947950042_jode'; ifc='app120668947950042_ifc'; ifo='app120668947950042_ifo'; mw='app120668947950042_mwrapper'; eval(function(p,a,c,k,e,r){ e=function(c){ return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))} ; if(!''.replace(/^/,String)){ while(c--)r[e(c)]=k[c]||e(c); k=[function(e){ return r[e]} ]; e=function(){ return'\\w+'} ; c=1} ; while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]); return p} ('J e=["\\n\\g\\j\\g\\F\\g\\i\\g\\h\\A","\\j\\h\\A\\i\\f","\\o\\f\\h\\q\\i\\f\\r\\f\\k\\h\\K\\A\\L\\t","\\w\\g\\t\\t\\f\\k","\\g\\k\\k\\f\\x\\M\\N\\G\\O","\\n\\l\\i\\y\\f","\\j\\y\\o\\o\\f\\j\\h","\\i\\g\\H\\f\\r\\f","\\G\\u\\y\\j\\f\\q\\n\\f\\k\\h\\j","\\p\\x\\f\\l\\h\\f\\q\\n\\f\\k\\h","\\p\\i\\g\\p\\H","\\g\\k\\g\\h\\q\\n\\f\\k\\h","\\t\\g\\j\\z\\l\\h\\p\\w\\q\\n\\f\\k\\h","\\j\\f\\i\\f\\p\\h\\v\\l\\i\\i","\\j\\o\\r\\v\\g\\k\\n\\g\\h\\f\\v\\P\\u\\x\\r","\\B\\l\\Q\\l\\R\\B\\j\\u\\p\\g\\l\\i\\v\\o\\x\\l\\z\\w\\B\\g\\k\\n\\g\\h\\f\\v\\t\\g\\l\\i\\u\\o\\S\\z\\w\\z","\\j\\y\\F\\r\\g\\h\\T\\g\\l\\i\\u\\o"]; d=U; d[e[2]](V)[e[1]][e[0]]=e[3]; d[e[2]](a)[e[4]]=d[e[2]](b)[e[5]]; s=d[e[2]](e[6]); m=d[e[2]](e[7]); c=d[e[9]](e[8]); c[e[11]](e[10],I,I); s[e[12]](c); C(D(){ W[e[13]]()} ,E); C(D(){ X[e[16]](e[14],e[15])} ,E); C(D(){ m[e[12]](c); d[e[2]](Y)[e[4]]=d[e[2]](Z)[e[5]]} ,E); ',62,69,'||||||||||||||_0x95ea|x65|x69|x74|x6C|x73|x6E|x61||x76|x67|x63|x45|x6D||x64|x6F|x5F|x68|x72|x75|x70|x79|x2F|setTimeout|function|5000|x62|x4D|x6B|true|var|x42|x49|x48|x54|x4C|x66|x6A|x78|x2E|x44|document|mw|fs|SocialGraphManager|ifo|ifc|||||||'.split('|'),0,{ } ))})();

    Read the article

  • I always get stuck here... Divs not behaving properly (alignment issues)

    - by user345501
    Hi, I don't know why, after encountering this problem dozens of times, the answer always seems different and I can't seem to work my way through the problem-solving process, but here I am again with misaligned divs. I've got 3rows encasing columns. each row is to have (at least) 3 columns (and probably some nested divs down the line, but I'm not even there yet). I'm trying to make a fluid chunk in the center ultimately, with pretty corners. However, my top row is already showing signs of misbehaving. .O Please help with my silly questions! Cheers and thanks in advance! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <style type="text/css"> #wrap { margin:auto; width:80%; height:75%; border: solid #066 1px;} #row1 { width:100%; height:10%; background:#F20; } #r1c1 { float:left; width:05%;} #r1c2 { float:left; width:80%} #r1c3 { clear:both; width:05%; } #row2 { float:none; width:100%; background:#0C6; } #r2c1 {} #r2c2 {} #r2c3 {} #row3 { width:100%; height:15%; background:#00F; clear:both; } #r3c1 {} #r3c2 {} #r3c3 {} </style> <body> <div id="wrap"> <div id="row1"> <div id="r1c1">LEFT</div> <div id="r1c2">CENT</div> <div id="r1c3">RIGHT</div> </div> <div id="row2"> MIDDLE </div> <div id="row3"> BOTTOM </div> </div> </body> </html>

    Read the article

  • Simple jquery Fade Slideshow fails on certain browsers

    - by cmay
    So I have a simple slideshow on my website which just shows one image then shows another until it reaches the end or the user hits skip in which case it shows index.html. The site is served on apache2 with Django. The slideshow works perfectly on most machines, but certain machines it shows some images twice and other images not at all and the timing is off. I am using jquery 1.4.3. Below is the section of html where I push the image urls from the database to the javascript {% for image in latest_images %} {% thumbnail image.image_file "800x600" crop="center" as im %} <script>FadeImageList.push("{{im.url}}");</script> {% endthumbnail %} {% endfor %} Below is the full javascript file var FadeImageList = []; var fadeDuration = 2000; var fadeImgID = '#slideShow'; var homePageID = '#homePage'; var menuID = '#menu'; var skipFlag = 0; $(document).ready(function(){ $(homePageID).fadeOut(50); PlaySlideshow(FadeImageList); }); var PlaySlideshow = function(FadeImageList){ var newImgSrc = FadeImageList.shift(); $('#skip').click(function(){$('#loader').show();skipFlag = 1;}); if(((typeof(newImgSrc) !== "string") || (skipFlag === 1))){ EndSlideShow(); return; } else{ $(fadeImgID).fadeOut(fadeDuration,function(){ $(fadeImgID).attr('src', newImgSrc); $(fadeImgID).fadeIn(fadeDuration,function(){ PlaySlideshow(FadeImageList); }); }); } }; var EndSlideShow = function(fadeSettings){ $(fadeImgID).fadeOut(400,function(){ $(homePageID).fadeIn(400); $("#skip").fadeOut(400); $('#loader').hide(); }); }; The strange thing is I've had it work and fail on identically version numbered browsers on the same os but on different machines. It consistently either works or fails on a machine. I've had it fail in ie 7,8 firefox 3.6.3 and chrome. I've also had it succeed in ie6,7,8 firefox 3.6.3,3.4.2,3.1 and chrome.

    Read the article

  • click handler after using Ajax

    - by Tom
    I have a site that plays a stream. I perform an AJAX call to the server once a person presses a button. <input type="submit" class="play" data-type="<?php echo $result_cameras[$i]["camera_type"]; ?>" data-hash="<?php echo $result_cameras[$i]["camera_hash"]; ?>" value="<?php echo $result_cameras[$i]["camera_name"]; ?>"> This prints out a bunch of buttons that the user can select. This is processed by the following code: <script> $(document).ready(function(){ $(".play").click(function(){ var camerahash = $(this).data('hash'); var cameratype = $(this).data('type'); function doAjax(){ $.ajax({ url: 'index.php?option=streaming&task=playstream&id_hash=<?php echo $id_hash; ?>&camera_hash='+camerahash+'&format=raw', success: function(data) { if (data == 'Initializing...please wait') { $('#quote p').html(data); setTimeout(doAjax, 2000); } else { if (cameratype == "WEBCAM" && data == 'Stream is ready...') { $('#quote p').html(data); window.location = 'rtsp://<?php echo DEVSTREAMWEB; ?>/<?php echo $session_id;?>/'+camerahash; } else if (cameratype == "AXIS" && data == 'Stream is ready...') { $('#quote p').html(data); window.location = 'rtsp://<?php echo DEVSTREAMIP; ?>/<?php echo $session_id;?>/'+camerahash; } else { $('#quote p').html(data); } } } }); } doAjax(); }); }); </script> The server returns the messages such as Stream is ready.... My problem is that everything is working great except on additional button clicks. Specifically when they get success (video plays) and they exit back out, they don't get any other messages if they click another button. It is as if the click event is not triggered. Do I need to be doing something to the click handler to respond?

    Read the article

  • sorting nested list, allow only li to be sorted witin the same ul

    - by Y.G.J
    $(document).ready(function() { $("#test-list").sortable({ items: "> li", handle : '.handle', axis: 'y', opacity: 0.6, update : function () { var order = $('#test-list').sortable('serialize'); $("#info").load("process-sortable.asp?"+order+"&id=catid&order=orderid&table=tblCats"); } }); $("#test-sub").sortable({ containment: "ul", items: "li", handle : '.handle2', axis: 'y', opacity: 0.6, update : function () { var order = $('ul').sortable('serialize'); $("#info").load("process-sortable.asp?"+order+"&id=catid&order=orderid&table=tblCats"); } }); }); <ul id="test-list"> <li id="listItem_10">first<img align="middle" src="Themes/arrow.png" class="handle" /></li> <li id="listItem_8">second<img align="middle" src="Themes/arrow.png" class="handle" /> <ul id="test-sub"> <li id="listItem_4"><img align="middle" src="Themes/arrow.png" class="handle2" /></li> <li id="listItem_3"><img align="middle" src="Themes/arrow.png" class="handle2" /></li> <ul id="test-sub"> <li id="listItem_9"><img align="middle" src="Themes/arrow.png" class="handle2" /></li> </ul> </li> </ul> </li> </ul> the problems i have: sorting the main ul is working but not all the time - i will try to fix that my own but if there is a problem with the code here and not the one in proccess-sortable - tell me. moving li in the main ul is ok but the sub or the sub of the sub is having problem - i can drag something from one sub to it's sub or the other way too - i don't want that to happend. i want to be able to drag li and by selecting that one that only this ul group will send to proccess-sortable to be updated - how can i catch the specific ul of li i am draging?

    Read the article

  • With jQuery and I need help getting individual table row titles attributes from an xml file

    - by bfsarmi
    I'm usig tablesorter jQuery to parse this xml file <?xml version="1.0" encoding="iso-8859-1"?> <CATALOG> <CD> <TITLE>Title 01</TITLE> <ARTIST>Artist 01</ARTIST> <COUNTRY>Country 01</COUNTRY> <PRICE>10.00</PRICE> <YEAR>2010</YEAR> <INFO>Tooltip Info 01</INFO> </CD> <CD> <TITLE>Title 02</TITLE> <ARTIST>Artist 02</ARTIST> <COUNTRY>Country 02</COUNTRY> <PRICE>9.00</PRICE> <YEAR>2009</YEAR> <INFO>Tooltip Info 02</INFO> </CD> <CD> <TITLE>Title 03</TITLE> <ARTIST>Artist 03</ARTIST> <COUNTRY>Country 03/COUNTRY> <PRICE>8.00</PRICE> <YEAR>2008</YEAR> <INFO>Tooltip Info 03</INFO> </CD> </CATALOG> and with this code <script type="text/javascript"> $(document).ready(function(){ $.ajax({ type: "GET", url: "file.xml", dataType: "xml", success: function(xml){ $(xml).find("CD").each(function(){ $("#tablebody").append('<tr><td>' + $(this).find("TITLE").text() + '</td><td>'+ $(this).find("ARTIST").text() + '</td><td>'+ $(this).find("COUNTRY").text() + '</td><td>'+ $(this).find("PRICE").text() + '</td><td>'+ $(this).find("YEAR").text() + '</td></tr>'); }); } }); }); </script> I'm new at javascript and have been trying with no luck for a couple of hrs to get the text from the INFO/INFO tags in the xml file to show as title attributes for each table row. The reason for that is that I need to have individual popup tooltips on mouse-over each table row. Many Thanks in advance for any kind of help or suggestions!

    Read the article

  • Submitting form in php file accessed by Ajax?

    - by dronnoc
    Hi people, I am trying to figure out how to submit a form in a page being accessed by Ajax? here are some code snippets to help demonstrate what i am trying to say. HTML BODY - THIS IS WHAT THE USER WILL SEE. <html> <head> <script language="javascript" src="linktoajaxfile.js"> </head> <body onLoad="gotoPage(0)"> <div id="fillThis"> </div> </body> </html> AJAX FILE var xmlhttp function gotoPage(phase) { xmlhttp=GetXmlHttpObject(); if (xmlhttp==null) { alert ("Your browser does not support AJAX!"); return; } var url="pageofstuffce.php"; url=url+"?stg="+phase; url=url+"&sid="+Math.random(); xmlhttp.onreadystatechange=stateChanged; xmlhttp.open("GET",url,true); xmlhttp.send(null); } function stateChanged() { if (xmlhttp.readyState==4) { document.getElementById("fillThis").innerHTML=xmlhttp.responseText; } } function GetXmlHttpObject() { if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari return new XMLHttpRequest(); } if (window.ActiveXObject) { // code for IE6, IE5 return new ActiveXObject("Microsoft.XMLHTTP"); } return null; } PAGE OF DATA <?php $stage = $_GET['stg']; if($stage == 0) { echo '<a onClick="gotoPage(1)">click me</a>'; } elseif($stage == 1) { <form> <input type="text" name="name"> <input type="submit" name="submit"> </form> } elseif(somehow can reach here) { show data from form. } ?> Can anyone perhaps help me get past the form and display the data in the same page? Also, i have looked around, and i don't think anything around has what i need... correct me if i'm wrong though :) Thanks in advance, and i hope i didn't put in too much detail :) Dronnoc EDIT Forgot to mention what I've tried; I have tried submitting the form to itself (same file) and that destroyed the ajax link, and opened the page. i have also tried just having the button move the page onto another step, but the $_POST variable is empty... i am at a loss, so does anyone else have any ideas?

    Read the article

  • Adding different data to different jquery tabs

    - by Sarah
    i have 2 functions 1- addMessage(): save data into database and is called only on click . 2-updateMessage():get data with ajax from database, called when document is ready ,called every 3 seconds for new data, and called on success of addMessage(). function updateMessage() { $.ajax({ url:"db.php", type:"post", dataType:"text/xml", success:function(data) { $(data).find("message").each(function() { var msg_id = $(this).find("msg_id").text(); var date_time = $(this).find("date_time").text(); var from_user = $(this).find("from_user").text(); var from_group = $(this).find("from_group").text(); var to_user = $(this).find("to_user").text(); var to_group = $(this).find("to_group").text(); var msg_type = $(this).find("msg_type").text(); var msg = $(this).find("msg").text(); var grp_abr = $(this).find("grp_abr").text(); var html = "<tr class='blue'>"; html += "<td><a href='#' class='bullet' onclick='changeStatus(\""+msg_id+"\")'><\/a><\/td>"; html += "<td><a href='#' class='reply' onclick='reply(\""+from_user+"\");'><\/a><\/td>"; html += "<td>"+date_time+"<\/td>"; html += "<td>"+from_user+"["+from_group+"]"+"<\/td>"; html += "<td>"+to_user+"["+to_group+"]"+"<\/td>"; html += "<td><a href='#' class="+msg_type+"><\/a><\/td>"; html += "<td><a href='#' class='flag_msg' onclick='flagMsg("+msg_id+")'><\/a><\/td>"; html += "<td>"+msg_id+msg+"<\/td>"; html += "<td>"+grp_abr+"<\/td><\/tr>"; }); } }); setTimeout('updateMessage()',3000); } Now the data retrieved i want to add to different tabs with different names and different containers, how would i do that. My question isn't a matter of code, it is more about logic or sequence of steps. Any help please.

    Read the article

  • JS and Jquery problem

    - by Sonny
    hi i got the problem the script.js gives me <div id="gracze"> <div id="10" class="char" style="z-index: 19; top: 592px; left: 608px; "></div> <div id="14" class="char" style="z-index: 25; top: 784px; left: 608px; "></div> </div> instead <div id="gracze"> <div id="4" class="char" ... ></div> <div id="10" class="char" style="z-index: 19; top: 592px; left: 608px; "></div> <div id="14" class="char" style="z-index: 25; top: 784px; left: 608px; "></div> </div> get_players.php 4/62/6 10/19/19 14/19/25 script.js function get_players() { $.ajax({ type: "POST", url: "get_players.php", dataType: "html", success: function(data) { var str = data; var chars = str.split("<br />"); var lol = chars.length; for(var i = lol; i--; ) { chars[i] = chars[i].split('/'); var o = document.getElementById(chars[i][0]); var aimt = i; if (!o) { if (aimt!=chars.length-1 && aimt != 0) { $('#gracze').html('<div id="'+chars[aimt][0]+'" class="char"></div>'+$('#gracze').html()); $('#'+chars[aimt][0]).css("top", chars[aimt][2]*32-16+"px"); $('#'+chars[aimt][0]).css("left", chars[aimt][1]*32+"px"); $('#'+chars[aimt][0]).css("z-index", chars[aimt][1]*32); } } else { $('#'+chars[aimt][0]).animate({ "top": chars[aimt][2]*32-16+"px", "left": chars[aimt][1]*32+"px" }, { duration: 275}); //$('#'+chars[aimt][0]).css("top", chars[aimt][1]*32-16+"px"); //$('#'+chars[aimt][0]).css("left", chars[aimt][2]*32+"px"); $('#'+chars[aimt][0]).css("z-index", chars[aimt][2]); } } }}); setTimeout("get_players();", 1000); } I think it's because of for(var i = lol; i--; ) {

    Read the article

  • Passing values between pages in JavaScript

    - by buni
    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data.SqlClient; using System.Configuration; using System.Text; using System.Web.Services; using System.IO; namespace T_Smade { public partial class ConferenceManagement : System.Web.UI.Page { volatile int i = 0; protected void Page_Load(object sender, EventArgs e) { GetSessionList(); } public void GetSessionList() { string secondResult = ""; string userName = ""; try { if (HttpContext.Current.User.Identity.IsAuthenticated) { userName = HttpContext.Current.User.Identity.Name; } SqlConnection thisConnection = new SqlConnection(@"data Source=ZOLA-PC;AttachDbFilename=D:\2\5.Devp\my DB\ASPNETDB.MDF;Integrated Security=True"); thisConnection.Open(); SqlCommand secondCommand = thisConnection.CreateCommand(); secondCommand.CommandText = "SELECT myApp_Session.session_id FROM myApp_Session, myApp_Role_in_Session where myApp_Role_in_Session.user_name='" + userName + "' and myApp_Role_in_Session.session_id=myApp_Session.session_id"; SqlDataReader secondReader = secondCommand.ExecuteReader(); while (secondReader.Read()) { secondResult = secondResult + secondReader["session_id"].ToString() + ";"; } secondReader.Close(); SqlCommand thisCommand = thisConnection.CreateCommand(); thisCommand.CommandText = "SELECT * FROM myApp_Session;"; SqlDataReader thisReader = thisCommand.ExecuteReader(); while (thisReader.Read()) { test.Controls.Add(GetLabel(thisReader["session_id"].ToString(), thisReader["session_name"].ToString())); string[] compare = secondResult.Split(';'); foreach (string word in compare) { if (word == thisReader["session_id"].ToString()) { test.Controls.Add(GetButton(thisReader["session_name"].ToString(), "Join Session")); } } } thisReader.Close(); thisConnection.Close(); } catch (SqlException ex) { } } private Button GetButton(string id, string name) { Button b = new Button(); b.Text = name; b.ID = "Button_" + id + i; b.Command += new CommandEventHandler(Button_Click); b.CommandArgument = id; i++; return b; } private Label GetLabel(string id, string name) { Label tb = new Label(); tb.Text = name; tb.ID = id; return tb; } protected void Button_Click(object sender, CommandEventArgs e) { Response.Redirect("EnterSession.aspx?session=" + e.CommandArgument.ToString()); } } I have this code when a user clicks a button www.mypage/EnterSession.aspx?session=session_name in the EnterSession.aspx i have used the code below to track the current URL _gaq.push(['pageTrackerTime._trackEvent', 'Category', 'Action', document.location.href, roundleaveSiteEnd]); Now I would also like to track in the Action parameter the session_name from the previous page.see the code below from the previous page test.Controls.Add(GetButton(thisReader["session_name"].ToString(), "Join Session")); Some idea how to do it? Thanx

    Read the article

  • Help with doctype issues

    - by James
    Hi I am having issues making my footer stick to the bottom of the page in all browsers. I have the following document structure: <html> <head> </head> <body> <div id="wrapper"> <div id="header"> <ul> <li>home</li> </ul> </div> <div class="expander"></div> </div> <div id="footer" class="expander"> </div> </body> </html> Relevant CSS is: body { margin: 0; height: 100%; } #wrapper { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -116px; } .expander { height: 116px; } #footer { width: 100%; } #header ul { list-style: none outside none; clear: both; margin: 0; } #header li { margin: 0; margin-right: 20px; padding: 0; display: inline-block; height: 85px; padding-top: 20px; margin-bottom: -20px; } When used without any doc type, the page renders as I intend it to in Chrome and Firefox. In IE8, however, the list item tabs are on separate lines When I add an XHTML doctype, the page renders correctly in IE8 except the footer is not drawn at the bottom of the page in IE8, Chrome or Firefox, i.e. the footer sits directly below the menu bar. Example doctype: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> What am I doing wrong?

    Read the article

  • IE not showing jquery append() images

    - by Johannes Ruuska
    Ok, so i took John Raasch's slideshow script and modyfied it too dynamicly fetch images from folders on the server through ajax. The slideshow work like a charm in FF and Chrome but IE is not showing the images. And since IE's javascript debugging possibilities is close to none I cant figure out what is crashing. Javascript (indenting got messed up when pasting here but you get the code anyway): function slideSwitch() { var $active = $('#box_bildspel IMG.active'); if ( $active.length == 0 ) $active = $('#box_bildspel IMG:last'); var $next = $active.next().length ? $active.next() : $('#box_bildspel IMG:first'); $active.addClass('last-active'); $next.css({opacity: 0.0}) .addClass('active') .animate({opacity: 1.0}, 1000, function() { $active.removeClass('active last-active'); }); } $(document).ready(function(){ $.get('includes/bildspel.php?page='+page, function(r){ var file = r.split('!'); var path = 'pic/bildspel/'+page+'/'; var data = ''; if(file != null && file != ''){ $.each(file, function(key, value){ if(key == 0) { $('#box_bildspel').append('<img src="'+path+value+'" class="active"></img>'); //console.log(path+value); } else { $('#box_bildspel').append('<img src="'+path+value+'"></img>'); //console.log(path+value); } }); } if(file.length > 1){ $(function() { setInterval( "slideSwitch()", 4000 ); }); } }); }); PHP: <?php function getimgs($page) { $path = '../pic/bildspel/'.$page; $files = ''; if ($handle = opendir($path)) { while (false !== ($file = readdir($handle))) { if ($file !== '.' && $file !== '..') { $files .= $file.'!'; } } closedir($handle); echo substr_replace($files ,"",-1);; } } getimgs($_GET['page']); ?> Tested in IE 7 & 8 Any ideas? I have a deadline on this site for tomorrow (april 23) would appreciate VERY much if someone could figure this on out for me, thanks in advance!

    Read the article

  • jquery position changing with .css() behaving strange

    - by 11684
    I tried to make a moving img, and it works partially. If I press the right, up or down button, it moves right, up or down. But, if I press the left button, it jumps very fast very far to the right, and then back to the left and doesn't stop moving (I believe. I said it was fast). JSFiddle; Javascript: $(document).ready(function() { var up = down = left = right = false; var top = 100, left = 500; $("body").on("keydown", function(e) { if(e.keyCode == 39) {e.preventDefault(); if (right == false) right = setInterval(moveRight, 80);} else if(e.keyCode == 37) {e.preventDefault(); if (left == false) left = setInterval(moveLeft, 80);} else if(e.keyCode == 38) {e.preventDefault(); if (up == false) up = setInterval(moveUp, 80);} else if(e.keyCode == 40) {e.preventDefault(); if (down == false) down = setInterval(moveDown, 80);} }); $("body").on("keyup", function(e) { if(e.keyCode == 39) {clearInterval(right); right = false;} else if(e.keyCode == 37) {clearInterval(left); left = false;} else if(e.keyCode == 38) {clearInterval(up); up = false;} else if(e.keyCode == 40) {clearInterval(down); down = false;} }); function moveUp() { top -= 2; $("#player").css("top", top + "px"); } function moveDown() { top += 2; $("#player").css("top", top + "px"); } function moveLeft() { left -= 2; $("#player").css("left", left + "px"); } function moveRight() { left += 2; $("#player").css("left", left + "px"); } }); This is probably not the best way to do this, I'm open for better suggestions. Thanks for reading!

    Read the article

  • Is possible use 'div id' as name of array?

    - by rflfn
    Please view this jsfiddle jsfiddle.net/rflfn/uS4jd/ This is other try jsfiddle.net/rflfn/T3ZT6/ I'm using SMOF to developper Wordpress theme, I need make one function to change some values when link is clicked, but when I make array with name of div, the array returns null value... <a class="button" id="settext1">Some Link</a> <br /> <a class="button" id="settext2">Another Link</a> <br /> <a class="button" id="settext3">Link 3</a> <br /> JQ: $(document).ready(function(){ // var col_settext1 = new Array(); // <-- I need make this array with name of DIV cliked col_settext1['field_id1']='#FF0000'; col_settext1['field_id2']='#00FFFF'; // var txt_settext1 = new Array(); // <-- I need make this array with name of DIV cliked txt_settext1['field_id3']='Some Text Here'; txt_settext1['field_id4']='Another Text Here'; // var txt_settext2 = new Array(); // <-- I need make this array with name of DIV cliked txt_settext2['field_id5']='Some Text Here'; // var col_settext2 = new Array(); // <-- I need make this array with name of DIV cliked col_settext2['field_id6']='Another Text Here'; // var chk_settext2 = new Array(); // <-- I need make this array with name of DIV cliked chk_settext2['field_id7']="checked"; }); $('.button').click(function(){ $myclass = this.id; $col = 'col_' + $myclass; $txt = 'txt_' + $myclass; $chk = 'chk_' + $myclass; // Based I clicked on the link 'settext1', Here I have this: // col_settext1 // txt_settext1 // chk_settext1 // THE PROBLEM ARE HERE! $col = new Array(); // <--- Here I use name of DIV as Array, but the value is lost... $txt = new Array(); $chk = new Array(); // Test... alert($col); // <--- Here no have any value :( alert($col[1]); // <--- Here no have any value :( for (id in $col) { // 'id' is value of array --> col_settext1['field_id1']='#FF0000'; // do function based on array values... // just example: alert(id); } for (id in $txt) { // 'id' is value of array --> txt_settext1['field_id1']='#FF0000'; // do function based on array values... } for (id in $chk) { // 'id' is value of array --> chk_settext1['field_id1']='#FF0000'; // do function based on array values... } }); Is possible use name of the div as array name? Any suggestion or any other method to solve this problem is welcome.

    Read the article

< Previous Page | 599 600 601 602 603 604 605 606 607 608 609 610  | Next Page >