JavaScript - Jquery Simple Function Problem
So, basically what i'm doing here is hovering over the h2 heading and toggling the paragraph text. What i'm having a problem doing is changing the h3 headings so that they toggle the same way...is there a way to do this within this function without ids/classes?
Code: <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#hdg').hover(function() { $('div[title=latin]').toggle(); $('div[title=english]').toggle(); $('#').html('<h3>English</h3>'); }); }); </script> Similar TutorialsHello I would like to know how this is not functional. surely passing the function to another function would work so I can use the same variables without having to write it out again. [ICODE] <html> <head> <title>Number Conversions</title> <script> function addNumbers () { var firstnumber = document.calculator.myFirstNumber.value; var secondnumber = document.calculator.mySecondNumber.value; var total = parseInt(firstnumber) + parseInt(secondnumber); document.calculator.myTotal.value = total; document.calculator.myHex.value = total.toString(16); document.calculator.myOct.value = total.toString(8); document.calculator.myBinary.value = total.toString(2); document.write("End of Calculation."); } function subtractNumbers (addNumbers) { var total = parseInt(firstnumber) - parseInt(secondnumber); } </script> </head> <body> <form name="calculator"> First Number <input type=text name="myFirstNumber" value=0 size=3> <br> Second Number <input type=text name="mySecondNumber" value=0 size=3><br><br> <input type="button" value="ADD" onclick="addNumbers();"> <input type="button" value="SUBTRACT" onclick="subtractNumbers();"><br> Total <input type=text name="myTotal" value=0 size=3><br> Binary <input type=text name="myBinary" value=0 size=8><br> Octal <input type=text name="myOct" value=0 size=3><br> Hexidecimal <input type=text name="myHex" value=0 size=3><br> </form> </body> </html> [ICODE] Hello was following a tutorial online from bucky. and created a new example with different variables and such. My code in my eyes looks absolutely fine but however it does not display can anyone spot the problem? [code] <!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> <script type="text/javascript"> function cigerettes (brand, tar, price) { this.brand=brand; this.tar=tar; this.price=price; this.ReducedCost = discount; } function discount() { var reduction = 20; var finalCost = this.price - reduction; return finalCost; } var packet1 = new cigerettes("Mayfair", "2.0 mg", 399); var packet2 = new cigerettes("Sovereign", "3.4 mg", 425); </script> </head> <body> <script type="text/javascript"> document.write(packet1.brand() + " they contain " + packet1.tar() + "of tar " + "the packet cost me " + packet1.price() + ". With discount I got them for: " + packet1.ReducedCost()); </script> </body> </html> [code] Code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>New Page 2</title> </head> <SCRIPT LANGUAGE = JavaScript> function estimateHolidays() { var service1; var service2; var service3; var txtGrade; var txtHolidays; var dblEntitlement; var strService; strService = cmbService.value; if (strService == "Service1") { dblEntitlement = 20; } else if (strService == "Service2" && Grade--"1") { dblEntitlement = 24; } else if (strService == "Service2" && Grade--"2") { dblEntitlement = 26; } else if (strService == "Service2" && Grade--"3") { dblEntitlement = 28; } else if (strService == "Service3") { dblEntitlement = 30; } else { dblEntitlement = "Error! Please try again."; } txtHoliday.value = dblEntitlement; } </SCRIPT> <body> <p> <input name="txtGrade" size="25" value="Enter Your Staff Grade"> </p> <p> Years of Service: <select name="cmbService" size="1"> <option value="Service1">Less than 5 years service</option> <option value="Service2">5 to 9 years service</option> <option value="Service3">10 or more years of service</option> </select> </p> <p> <input type="button" value="Estimate Holidays" name="cmdEstimateHolidays" onclick="estimateHolidays()"> </p> <p> Holiday Entitlement: <input name="txtHolidays" size="25"> </p> </body> </html> Why won't this code work!? Its driving me mad. Im looking to make the button in openWin2 (the cat pic) should close openWin1 (the bird pic)...also need to change the background color of openWin2...Any help would be appreciated. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DND HTML 4.01//EN" "http:www.w3.org/TR//html4/strict.dtd"> <html> <head> <title>TEST</title> <script type="text/javascript" src="http://code.jquery.com/jquery- latest.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#openWin1').click(function() { myWin1 = open('','','width=350,height=350'); var html = '<h3>Bird</h3>'; html += '<img src="bird.png"><br />'; myWin1.document.write(html); }); $('#openWin2').click(function() { var myWin2 = open('','win2','height=350,width=350'); var html = '<h3>Cat</h3>'; html += '<img src="cat.png"><br />'; html += '<button onclick="opener.openWin1.close();">Close</button>'; myWin2.document.write(html) ;}) ;}); </script> </head> <body> <p> <input type="button" id="openWin1" value="Display a bird" onclick="openWin1()" /> </p> <p> <a href id="openWin2" onclick="openWin2()">Display a cat</a> </p> </body> </html> Hi, im having 2 javascript problems that maybe you guys could help with. my website is: www.pagefrog.net In chrome the drop down works great however on my other laptop using chrome also the drop down is extremely choppy, why is it choppy on one but not the other? - and if you go to www.pagefrog.net/questions.html ive used a togglebox script to expand the answers. This works fine in chrome and safari but in IE8 it just wont expand, why? As an added note the questions script is also really choppy on my 2nd laptop.. Any suggestions are greatly appreciated thank you.. Hello! I've been fighting with a jQuery slider all day, and it's going nowhere because admittedly I have extremely limited jQuery knowledge. I am really hoping that someone here is better at this than I am and can tell me why I see a list of the items that should be in the slider stacked up on top of each other rather than seeing the actual slider. Here is the functions.php code. All CSS is in place, but I can copy/paste the stylesheet if necessary as well. If this isn't an appropriate forum for this, can you point me in the right direction? I don't even know which way is up anymore!!! Code: <?php /* HEADER SCRIPTS */ function headscript() { global $post; if (function_exists('is_products_page')){ if ( get_post_type() == 'wpsc-product' || is_products_page() ) return; } ?> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-3270175-9']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { //Default Action $(".tab_content").hide(); //Hide all content $("ul.tabs li:first").addClass("active").show(); //Activate first tab $(".tab_content:first").show(); //Show first tab content //On Click Event $("ul.tabs li").click(function() { $("ul.tabs li").removeClass("active"); //Remove any "active" class $(this).addClass("active"); //Add "active" class to selected tab $(".tab_content").hide(); //Hide all tab content var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content $(activeTab).fadeIn(); //Fade in the active content return false; }); }); </script> <script type="text/javascript" src="http://www.claritymind.com/js/easySlider1.7.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#slider2").easySlider({ auto: true, continuous: true, pause: 6000, speed: 800, nextId: "slider1next", prevId: "slider1prev" }); }); </script> <script type="text/javascript"> $(function () { $('a#testbutton').hover(function() { $(this).fadeTo("fast", 1); }, function() { $(this).fadeTo("fast", .85); }); }); </script> <script type="text/javascript"> $(document).ready(function(){ $("#slider1").easySlider({ numeric: true, auto: true, continuous: true, pause: 9000, speed: 700, }); }); </script> <?php } /* PAGE SPECIFIC CSS TWEAKS */ function home_head() { if (is_home() || is_front_page()) { ?> <style type="text/css"> .custom .headline_area {display:none;} </style> <style type="text/css"> .custom .servnav {display:none;} </style> <?php } } function nonhomepagecss(){ if (!is_home() && !is_front_page()) { ?> <style type="text/css"> .custom #sidebars{margin-top:15px;background:none;} body.custom {background-color:#f5f6f7;} .custom #content_area {background-color: #F5F6F7;} .custom .post_box{padding-top:30px;} .custom #content_box{ margin: 30px auto; width: 960px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; background-color: white; box-shadow: 3px 3px 3px #CCC; -moz-box-shadow: 3px 3px 3px #CCC; -webkit-box-shadow: 3px 3px 3px #CCC; border-top: 1px solid #E8E8E8; border-left: 1px solid #E8E8E8; font-family: 'Lucida Grande', 'Lucida Grande Unicode', Helvetica, Verdana, sans-serif; padding-bottom: 30px; border-top-left-radius: 5px 5px; border-top-right-radius: 5px 5px; border-bottom-right-radius: 5px 5px; border-bottom-left-radius: 5px 5px; } </style> <?php } } function new_servicespage() { if (is_page('services') || is_page('30')) { ?> <style type="text/css"> .custom .topnav {display:none;} .custom .servnav {display:block;} </style> <div id="content"> <div class="post_box"> <div class="headline_area"> </div> Example text will go here. </div> </div> <div id="sidebars"><span class="newcallout1h4"> <table> <tr> <div style="vertical-align:top;"> <td width="275"><img src="http://cm.deviantwebdesign.com/wp-content/uploads/2012/03/VideoPlace.jpg" height="180" width="260"> </div> <td width="330"><div style="margin-left: 30px;"> <font color="#000000" font size="4">HEADLINE TEXT</font> <ul> <font color="#000000" font size="3"> <li>Bullet 1 - Example text goes here.</li> <li>Bullet 2. Ut enim ad minim veniam, quis nostrud exercitation.</li> <li>Bullet 3. Duis aute irure dolor in reprehenderit in voluptate velit esse.</li> </font> </ul> </div></td> <td width="275"><div style="margin-left: 30px;"> <script type="text/javascript" src="//moon-ray.com/v2.4/include/formEditor/genjs.php?html=true&uid=p2c6497f5&version=1"></script> </div></td> </tr> </table> </span> <?php thesis_build_sidebars(); ?> </div> <?php } } add_action('thesis_hook_custom_template', 'new_servicespage'); /* NAVIGATION MENU */ function navmenuarea(){ ?> <div class="topnav"> <div style="width:960px;margin-left:auto;margin-right:auto;"> <div style="float:left;"> <a href="http://claritymind.com/"><img alt="clrity-logo" src="http://www.claritymind.com/wp-content/uploads/2011/03/logosmall2.jpg" style="position:relative;left:0px;" /></a> </div> <div style="float:right;padding-top:11px;"> <ul id="navlist"> <li><a href="http://claritymind.com/services">Services</a></li> <li><a href="http://claritymind.com/next-step">Next Steps</a></li> <li><a href="http://claritymind.com/about">About</a></li> <li><a href="http://claritymind.com/free-articles">Free Stuff</a></li> <li><a href="http://claritymind.com/clients">Clients</a></li> <li><a href="http://claritymind.com/events">Events</a></li> <li><a style="color:#BCFC3D;" href="http://claritymind.com/products">Store</a></li> </ul> </div> </div> </div> <?php } /* FEATURED AREA */ function lowermenu(){ if (is_page()) { ?> <div class="clear"></div> <div style="width:100%;height:5px;"></div> <div class="pagecentered"> <div class="newcallout1"> </div> </div> <div style="width:100%;height:15px;"></div> <?php } } /* REGISTER SIDEBARS FOR CUSTOM SIDEBARS */ if (function_exists('register_sidebar')) { $sidebars = array(1,2, 3, 4, 5, 6, 7, 8, 9, 10); foreach($sidebars as $number) { register_sidebar(array( 'name' => 'Side ' . $number, 'id' => 'side-' . $number, 'before_widget' => '', 'after_widget' => '', 'before_title' => '<h3>', 'after_title' => '</h3>' )); } } function sidebartabs(){ if (function_exists('is_products_page')){ if ( get_post_type() == 'wpsc-product' || is_products_page() ) return; } ?> <div style="width:100%;height:25px;"></div> <div class="tabcontainer"> <ul class="tabs"> <li><a href="#tab1">Popular</a></li> <li><a href="#tab2">Latest</a></li> <li><a href="#tab3">Topics</a></li> <li><a href="#tab4">Links</a></li> </ul> <div class="tab_container"> <div id="tab1" class="tab_content" style="padding-right:0px;"> <a href="http://www.claritymind.com/next-step/" style="border:0;padding:0;margin:0;"><img src="http://www.claritymind.com/wp-content/uploads/2012/01/Master-Your-Mindset.png" alt="Change Your Mindset with Clarity Mind Coaching" style="border:0;padding:0;margin:0;" /></a> <div class="clear"></div> </div> <div id="tab2" class="tab_content"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Side 6') ) : ?> <?php endif; ?> </div> <div id="tab3" class="tab_content"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Side 7') ) : ?> <?php endif; ?> <div class="clear"></div> </div> <div id="tab4" class="tab_content"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Side 8') ) : ?> <?php endif; ?> </div> </div> </div> <div class="clear"></div> <?php } add_action('thesis_hook_before_sidebars', 'sidebartabs'); function home_pagecustom() { if (is_home() || is_page(4217)) { ?> <div style="height:0px;width:0px;position:relative;left:294px;z-index:999;"> <div style="width:356px;height:1px;background:#efefef;"></div> <div style="width:356px;padding-top:2px;"><span class="nqheading">Featured from the Blog</span></div> </div> <div id="slider1"> <ul> <?php query_posts($query_string . '&cat=-3,-8&posts_per_page=5'); ?> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <li> <div class="post"> <div style="width:279px;margin-right:15px;float:left;"> <?php $post_image = thesis_post_image_info('image'); echo $post_image['output']; ?> </div> <div style="width:356px;float:right;padding-top:20px;"> <div style=height:300px;overflow:hidden;"> <!-- Display the Title as a link to the Post's permalink. --> <h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <div class="entry"> <?php the_excerpt(); ?> </div> </div> <div style="width:356px;height:2px;"></div> <span class="readstory"><a href="<?php the_permalink() ?>" rel="bookmark" title="Continue Reading <?php the_title_attribute(); ?>">Continue Reading Post →</a> </div> <div class="clear"></div> </div> <!-- closes the first div box --> </li> <?php endwhile; else: ?> <p>Sorry, no posts matched your criteria.</p> <?php endif; ?> </ul> </div><!-- close slider1 --> <?php wp_reset_query(); ?> <div style="width:650px;margin-top:10px;"> <div class="one_third"> <div style="width:100%;height:1px;background:#efefef;"></div> <div style="width:100%;padding-top:2px;"><span class="nqheading">Lifestyle Design</span></div> <div style="width:199px;height:10px;"></div> <?php query_posts($query_string . '&cat=37&posts_per_page=3'); ?> <?php if (have_posts()) : ?> <?php $count = 0; ?> <?php while (have_posts()) : the_post(); ?> <?php $count++; ?> <?php if ($count <= 1) : ?> <?php $post_image = thesis_post_image_info('thumb');echo $post_image['output']; ?> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <span class="teaserexcerpt"><?php the_excerpt(); ?></span> <?php else : ?> <div style="width:199px;height:1px;border-top:1px dotted #cecece;margin-top:5px;"></div> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <?php endif; ?> <?php endwhile; ?> <?php else : ?> <?php endif; ?> <?php wp_reset_query(); ?> </div> <div class="one_third"> <div style="width:100%;height:1px;background:#efefef;"></div> <div style="width:100%;padding-top:2px;"><span class="nqheading">Love & Relationships</span></div> <div style="width:199px;height:10px;"></div> <?php query_posts($query_string . '&cat=39&posts_per_page=3'); ?> <?php if (have_posts()) : ?> <?php $count = 0; ?> <?php while (have_posts()) : the_post(); ?> <?php $count++; ?> <?php if ($count <= 1) : ?> <?php $post_image = thesis_post_image_info('thumb');echo $post_image['output']; ?> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <span class="teaserexcerpt"><?php the_excerpt(); ?></span> <?php else : ?> <div style="width:199px;height:1px;border-top:1px dotted #cecece;margin-top:5px;"></div> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <?php endif; ?> <?php endwhile; ?> <?php else : ?> <?php endif; ?> <?php wp_reset_query(); ?> </div> <div class="one_third last"> <div style="width:100%;height:1px;background:#efefef;"></div> <div style="width:100%;padding-top:2px;"><span class="nqheading">Personal Growth</span></div> <div style="width:199px;height:10px;"></div> <?php query_posts($query_string . '&cat=226&posts_per_page=3'); ?> <?php if (have_posts()) : ?> <?php $count = 0; ?> <?php while (have_posts()) : the_post(); ?> <?php $count++; ?> <?php if ($count <= 1) : ?> <?php $post_image = thesis_post_image_info('thumb');echo $post_image['output']; ?> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <span class="teaserexcerpt"><?php the_excerpt(); ?></span> <?php else : ?> <div style="width:199px;height:1px;border-top:1px dotted #cecece;margin-top:5px;"></div> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <?php endif; ?> <?php endwhile; ?> <?php else : ?> <?php endif; ?> <?php wp_reset_query(); ?> </div> <div class="clear"></div> </div> <div class="newcallout"> <h4 class="newcallouth4"><a href="http://www.claritymind.com/soul-affirmation-music-for-better-outcomes/">Browse Affirmation Music for Sale!</a></h4> </div> <div style="width:650px;margin-top:30px;"> <div class="one_third"> <div style="width:100%;height:1px;background:#efefef;"></div> <div style="width:100%;padding-top:2px;"><span class="nqheading">Awareness</span></div> <div style="width:199px;height:10px;"></div> <?php query_posts($query_string . '&cat=15&posts_per_page=3'); ?> <?php if (have_posts()) : ?> <?php $count = 0; ?> <?php while (have_posts()) : the_post(); ?> <?php $count++; ?> <?php if ($count <= 1) : ?> <?php $post_image = thesis_post_image_info('thumb');echo $post_image['output']; ?> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <span class="teaserexcerpt"><?php the_excerpt(); ?></span> <?php else : ?> <div style="width:199px;height:1px;border-top:1px dotted #cecece;margin-top:5px;"></div> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <?php endif; ?> <?php endwhile; ?> <?php else : ?> <?php endif; ?> <?php wp_reset_query(); ?> </div> <div class="one_third"> <div style="width:100%;height:1px;background:#efefef;"></div> <div style="width:100%;padding-top:2px;"><span class="nqheading">Meditation</span></div> <div style="width:199px;height:10px;"></div> <?php query_posts($query_string . '&cat=40&posts_per_page=3'); ?> <?php if (have_posts()) : ?> <?php $count = 0; ?> <?php while (have_posts()) : the_post(); ?> <?php $count++; ?> <?php if ($count <= 1) : ?> <?php $post_image = thesis_post_image_info('thumb');echo $post_image['output']; ?> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <span class="teaserexcerpt"><?php the_excerpt(); ?></span> <?php else : ?> <div style="width:199px;height:1px;border-top:1px dotted #cecece;margin-top:5px;"></div> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <?php endif; ?> <?php endwhile; ?> <?php else : ?> <?php endif; ?> <?php wp_reset_query(); ?> </div> <div class="one_third last"> <div style="width:100%;height:1px;background:#efefef;"></div> <div style="width:100%;padding-top:2px;"><span class="nqheading">Spirituality</span></div> <div style="width:199px;height:10px;"></div> <?php query_posts($query_string . '&cat=61&posts_per_page=3'); ?> <?php if (have_posts()) : ?> <?php $count = 0; ?> <?php while (have_posts()) : the_post(); ?> <?php $count++; ?> <?php if ($count <= 1) : ?> <?php $post_image = thesis_post_image_info('thumb');echo $post_image['output']; ?> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <span class="teaserexcerpt"><?php the_excerpt(); ?></span> <?php else : ?> <div style="width:199px;height:1px;border-top:1px dotted #cecece;margin-top:5px;"></div> <h2 class="teasertitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <?php endif; ?> <?php endwhile; ?> <?php else : ?> <?php endif; ?> <?php wp_reset_query(); ?> </div> <div class="clear"></div> <br /><br /><br /><br /> </div> <?php } } add_action('thesis_hook_before_content', 'home_pagecustom'); /* CUSTOM FOOTER */ function newfooter(){ ?> <div style="width:100%;height:80px;"></div> <div style="width:100%;background:#000000;" class="footernew1"> <div style="width:100%;height:0px;position:relative;top:-132px;z-index:-1;"> <div style="background:url(http://www.claritymind.com/wp-content/uploads/2011/03/mountainback2.jpg) bottom repeat-x;height:132px;width:100%;"></div> </div> <div class="pagecentered" style="padding-top:15px;"> <div class="one_third"> <img src="http://www.claritymind.com/wp-content/uploads/2011/03/certification1.jpg" alt="certification" /> <div style="width:100%;height:3px;border-bottom:1px dotted #444;"></div> <br /> <img src="http://www.claritymind.com/wp-content/uploads/2011/03/logosmall2.jpg" alt="Clarity Mind Logo" /><br /> 20 Ravenscroft Drive Asheville, NC 28801<br /> 404-NOW-MIND (404-669-6463)<br /> Skype: KenLad1 </div> <div class="one_third"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Side 9') ) : ?> <?php endif; ?> </div> <div class="one_third last"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Side 10') ) : ?> <?php endif; ?> </div> <div class="clear"></div> <div style="height:20px;width:100%;"></div> <span style="font-size:10px;color:#fff;">Copyright © Clarity Mind, LLC. All Rights Reserved. Reproduction without permission prohibited.</span> </div> </div> <?php } function format_gridview_desc($description){ if (strlen($description) > 175) $description = substr ( $description , 0 , 175 )."..."; echo $description; } /* create new side bar for music player - this will only be displayed on the product page */ register_sidebar(array( 'name'=> 'Music Player', 'id' => 'music_player', 'before_widget' => '', 'after_widget' => '', 'before_title' => '<h3>', 'after_title' => '</h3>', )); not sure if I"m doing this correctly so seeing who can see or tell me if I'm doing this wrong. Say you chose an option from select box it would go into the events table and see that there's not been another event with that id so it'll return 1 and put it inside the text field called Label and when the user fills out the rest of the form it'll put 1 for the label field in the database table when the form is submitted then say the next week rolls around and the user clicks on that same option again and it goes to the events table and sees that there's an occurance of that show via the matching eventids and grabs all the labels with that matching eventid which at this point is only 1 so it would add 1 to that number and return 2 to the Label form text field. form page Code: $('#eventid').change(function() { var eventid = $("select#eventid").val(); var dataString = 'eventid='+ eventid; $.ajax({ type: "POST", url: "processes/booking.php", data: eventid, success: function(data) { $('#label').append(data); } }); }); <div class="field required"> <label for="eventid">Select Event</label> <select class="dropdown" name="eventid" id="eventid" title="Select Event"> <option value="0">- Select -</option> <option value="0">** Recurring Events **</option> <?php $query = 'SELECT id, eventname FROM eventnames WHERE eventtype = "Recurring"'; $result = mysqli_query ( $dbc, $query ); // Run The Query while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) { print "<option value=\"".$row['id']."\">".$row['eventname']."</option>\r"; } ?> <option value="0">** Singular Events **</option> <?php $query = 'SELECT id, eventname FROM eventnames WHERE eventtype = "Singular"'; $result = mysqli_query ( $dbc, $query ); // Run The Query while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) { print "<option value=\"".$row['id']."\">".$row['eventname']."</option>\r"; } ?> <option value="0">** Pay Per View Events **</option> <?php $query = 'SELECT id, eventname FROM eventnames WHERE eventtype = "Pay Per View"'; $result = mysqli_query ( $dbc, $query ); // Run The Query while ( $row = mysqli_fetch_array ( $result, MYSQL_ASSOC ) ) { print "<option value=\"".$row['id']."\">".$row['eventname']."</option>\r"; } ?> </select> <span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span> </div> <div class="field required"> <label for="label">Event Label</label> <input type="text" class="text" name="label" id="label" title="Label" readonly="readonly" /> <span class="required-icon tooltip" title="Required field - This field is required, it cannot be blank, and must contain something that is different from emptyness in order to be filled in. ">Required</span> </div> processes/booking.php PHP Code: $eventid = (int)$_GET['eventid']; $result = mysqli_query("SELECT * FROM `events` WHERE `event_id` = '$eventid'"); $list = mysqli_num_rows($result); $label = $list + 1; I am attempting the use EasySlider to create a portfolio. Which you can view here. The EasySlider is embedded within an accordion, under the Portfolio tab. I have the first slider functioning properly, which you see by clicking on the Burts Bees tab. However, when you on to the MillionTrees and other tabs the EasySlider does not work. I know that the other tabs are being affected by the function because when you move the images under Burts Bees to a new image and switch back to Million Trees the beginning image changes. I have a feeling I am somehow using the buttons wrong, but I am not sure because I am very new to using JavaScript and jQuery. Any help would be greatly appreciated, thanks. Hi i have a code like this in my web site to slide a panel from left to right: <script type="text/javascript"> <!-- var sipPos = 0; $(document).ready(function() { $("#panel-tab").click(function(e) { //if(autoTimer) clearTimeout(autoTimer); //autoTimer = null; e.preventDefault(); $("#panel").animate({ left: sipPos }, 1764, 'linear', function() { if(sipPos == 0) { sipPos = -856; } else { sipPos = 0; } }); }); }); --> </script> ---CSS--- #panel { width: 864px; height: 369px; position: absolute; top: 195px; left: -856px;/*-856*/ z-index: 200; background:url('../images/bg_panel.png') no-repeat; padding:20px 0 0 18px; text-align:left; } #panel-tab { width: 21px; height: 371px; position: absolute; top: 9px; left: 856px; background:url(../images/panel-arrw-show.png) no-repeat; text-decoration: none; color: #FFFFFF; text-indent:-999999px; } What i want to do is use the animate function in jquery...like this $("#panel").animate({ left: 0 }) but not sure how to use that and on page load make the panel opens and stays open.. Any help Sam Hey All - I asked this a few days ago.. what I came up with works just fine, but I feel it doesn't take advantage of "classes". If you think I could make this better by turning it into a class or using some other notation, that would be great. Keep in mind, ALL this does is rewrite a pagination.... for a search return in a lightbox. I have this function called in the return function... Code: var srcpagParams = $H(); function buildPagi(param, currdsplyNum){ var temDsply = new Template('<strong>[#{total_display}<span id="count">#{prevImg} #{links} #{nextImg}</span>'), crnt_link = srcpagParams.set('crnt_link', param), // the page we want to see dsplyNum = srcpagParams.get('paginateNum'), // what is the number of returns per page ttl_lnks = Math.ceil( srcpagParams.get('numFound') / srcpagParams.get('paginateNum')), // total pages data_template = new Hash(); data_template.set('total_display',srcpagParams.get('numFound')); bldImg = function() { var prvB = '<a href="#content" id="pagiPrev" onclick="firesrc(this)">Prev<img src="blank.gif" /></a>'; var nxtB = '<a href="#content" id="pagiNext" onclick="firesrc(this)">Next<img src="blank.gif" /></a>'; data_template.set('prvImg',(crnt_link > 1) ? prvB : ""); data_template.set('nxtImg',(crnt_link < ttl_lnks) ? nxtB : ""); } bldLk = function(){ var holder = ""; if(ttl_lnks > 1){ var linkStr = new Template(' <a href="#content" onclick="firesrc(#{pos});"> Go to page #{pos}</a> '); $R(1,ttl_lnks).each(function(n) { var posit = {pos : n} holder += (crnt_link == n) ? " " + n + " " : linkStr.evaluate(posit); }); data_template.set('links',linkholder); } } bldRng = function(){ var currPaneRg = (dsplyNum * crnt_link) - (dsplyNum - currdsplyNum); data_template.set('range',((crnt_link - 1) * (dsplyNum) + 1 ) + " - " + currPaneRg); $('pages').update(temDsply.evaluate(data_template)).show(); } firesrc = function(cl){ var pagiPane = (typeof cl === "number") ? cl : (cl.id == "pagiNext") ? crnt_link + 1 : crnt_link - 1; var start = crnt_link * srcpagParams.get('paginateNum'); Alertsrc( $F('query') ,(pagiPane)) // pass the query to the json to return the current search request } bldImg(); buildLnk(); bldRng(); }; Since some of the data declared at the top changes depending on the return, I didn't know if I could "initialize" it in a class. But could I turn this into a class and if so - what I just use: var buildPagi = create.Class({ initialize: object.extend({ }) }) Call the function when we are passed some data: Code: buildPagi(somevalue, somevalue2) ** NOTE: I use the libraries prototype and jquery.. so use Create.Class and new Template are within the libraries... etc.. so, is there a more eloquent, or robust way to write what I did above? Hi everyone I need some help creating a function which does the same thing for the chosen elements. I have #design1 #design1servicetext and #design1servicebutton. Code: //Service hover// $('#design1').mouseenter(function (){ $('#design1servicetext').css('background-position', '0 -91px') $('#design1servicebutton').css('background-position', '0 -33px') }) .mouseleave(function (){ $('#design1servicetext').css('background-position', '0 0px') $('#design1servicebutton').css('background-position', '0 0px')}); //Service hover end// How can I create a function, in which I have to choose 3 divs to do the animation? A function like Code: animatebg('#design1','#design1servicetext','#design1servicebutton'); Can someone please help me? I've tried so many function tutorials but none of them worked for what I wanted to do. Thank you a lot in advance! I have a slideshow that allows the user to see the previous slide title and the next slide title along with the current slide and its content. I tested locally not in WP and the code worked fine. Once I placed my source within WP everything went south. I inspector the first line in the script seems to be what is having the issues - $(window).load(function(){ and I am unsure what to do next. The source was used from Edit fiddle - JSFiddle the page I am trying to get to work is located here - Sevices | Q&D CONSTRUCTION, INC.Q&D CONSTRUCTION, INC. I am open to any suggestions. Code: <script type='text/javascript' src="//cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20130801/jquery.cycle2.min.js"></script> <style type='text/css'> .cycle-slide { width: 100%; text-align: center; } img { max-width: 300px; } #next { float: right; } #prev { float: left; } .center { text-align: center; } </style> <script type="text/javascript">//<![CDATA[ $(window).load(function(){ var slideshow = $('.cycle-slideshow'); maxSlides = slideshow.data('cycle.opts').slideCount; slideshow.on({ 'cycle-update-view': function(event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) { UpdateTitles(); } }); function UpdateTitles(){ var currentSlide = slideshow.data('cycle.opts').currSlide; activeSlide = $(".cycle-slide-active"); activeTitle = activeSlide.data('title'); if(currentSlide == 0){ nextTitle = activeSlide.next().data('title'); prevTitle = $(".cycle-slide").eq(maxSlides).data('title'); } else if(currentSlide == maxSlides-1){ prevTitle = activeSlide.prev().data('title'); nextTitle = $(".cycle-slide").eq(0).data('title'); } else { nextTitle = activeSlide.next().data('title'); prevTitle = activeSlide.prev().data('title'); } $('h1').html(activeTitle); $('#prev').html("Previous: "+prevTitle); $('#next').html("Next: "+nextTitle); } UpdateTitles(); });//]]> </script> Hi, I've been playing around trying to recreate the way in which jQuery chains it's functions for it's "select" then "do" behaviour. Note: I don't want to chain functions with jQuery, I want to chain them like jQuery. So based on the jQuery code what I have so far is (doesn't work in IE): Code: var x = function(string) { return new x.fn.init(string); }; x.fn = x.prototype = { message: '', init: function(string) { x.fn.message = string; }, log: function() { console.log(x.fn.message); } }; x.fn.init.prototype = x.fn; var start = function() { x('hello world').log(); }; document.addEventListener('DOMContentLoaded', start, false); The code works but when I watch '$' in jQuery "fn" & "prototype" show up as being "jQuery()" but in my code when I watch "x": "fn" and "prototype" are both shown as objects containing "message", "init" and "log" and in both cases "init" contains "prototype" which contains my three functions again and the nesting continues seemingly infinitely... I'm clearly missing something here. What are they doing in differently in jQuery to prevent this endless nesting loop? How would I add up a array of numbers in a function? My numbers keep getting written as strings, instead of adding onto each other. I am a beginner. function (myNumbers) { var number = [6,9,10,13,14]; var total = 0; for(var total=0; total < number.length; total = total + 1) { total = total + number; document.write(total); } } myNumbers(); This is just an excercise. Code: function splook(val){ return speciesDB.queryBy(function(row){ return row.data.species_id == val; }).itemAt(0).data.speciesDB; } and the speciesDB Code: {success:true,rows:[{"species_id":"1","species_idx":"1","species":"Boa Constrictor"},{"species_id":"2","species_idx":"2","species":"Ball Python"},{"species_id":"3","species_idx":"3","species":"Reticulated Python"},{"species_id":"4","species_idx":"4","species":"SriLanka Python"},{"species_id":"5","species_idx":"5","species":"Blood Python"},{"species_id":"6","species_idx":"6","species":"Burmese Python"}]} I need to take val and match it with the data and return species. I just can't figure it out though! Thanks! I made a 50th anniversary guestbook to add memories/etc about our organization. The people can look at the entries and then if they want to add one of there own, there's a link that should pop up a form in a new for them to add it. I have no idea why this pop is not working in Internet Explorer (both IE6 and 7). It works beautifully in Firefox. I have no idea how you can go wrong with window.open. I'm stuck. Again, only the actual pop up function doesn't work. Everything else seems to be working fine. I included all of my code though even for the tab navigation because the link to the pop up form changes based on what tab they are in (i.e. if they're looking at the past memories tab and click on the link, it takes them to the past memories form). I know it's probably TMI on the code, but I thought it might be somehow related and better safe than sorry, right? HTML Page Code: <html> <head> <title>50th Anniversary Reflections</title> <script type="text/javascript" src="js/guestbook.js"></script> <link href="css/guestbook.css" media="all" type="text/css" rel="stylesheet"> </head> <body> <div id="guestbook_container"> <div id="tab_nav_container"> <ul> <li><div id="tab_1" class="tabs_on" onclick="tabsClass.switchTab(this);"><a target="gstbk_frame" href="guestbook_query.asp?cat=1" onclick="change_value(1);">Past Memories</a></div></li> <li><div id="tab_2" class="tabs_off" onclick="tabsClass.switchTab(this);"><a target="gstbk_frame" href="guestbook_query.asp?cat=2" onclick="change_value(2);">Career Impact</a></div></li> <li><div id="tab_3" class="tabs_off" onclick="tabsClass.switchTab(this);"><a target="gstbk_frame" href="guestbook_query.asp?cat=3" onclick="change_value(3);">Future Wishes</a></div></li> <li><div id="new" class="tabs_off" onclick="popupform();">Share Your Memories</div></li> </ul> </div><!-- end tab_nav_container --> <div id="tab_content_container"> <div id="tab_1_data" class="tab_content"><p class="tab_category">What is your most important memory of NACUA?</p></div> <div id="tab_2_data" class="tab_content" style="display: none;"><p class="tab_category">How has NACUA benefitted you and your career?</p></div> <div id="tab_3_data" class="tab_content" style="display: none;"><p class="tab_category">What is your most important wish or hope for NACUA's future?</p></div> </div><!-- end tab_content_container --> <script type="text/javascript"> tabsClass.addTabs("tab_nav_container"); </script> <br class="clear" /> <div id="iframe_container"> <iframe name="gstbk_frame" id="gstbk_frame" src="guestbook_query.asp?cat=1" width="730px" height="550px" scrolling="auto" frameborder="none"></iframe> </div><!-- end iframe_container --> <br class="clear" /> </div><!-- end guestbook_container --> </body> </html> Here's the guestbook.js file: Code: //***** ASSIGN/CHANGE CATEGORY VALUES ***** function popupform(){ var href; href="guestbook_submission_form.asp?cat="+catValue; window.open(href, "Submission Form", 'width=600, height=400, scrollbars=no'); } var catValue = "1" function change_value(catChange){ catValue=catChange; change_text(); } function change_text(){ if(catValue=="1"){ document.getElementById("new").innerHTML = "<a href='#' style='color:#ffffff;'>Share Your Memories!</a>"; } if(catValue=="2"){ document.getElementById("new").innerHTML = "<a href='#' style='color:#ffffff;'>Share Your Career Experiences!</a>"; } if(catValue=="3"){ document.getElementById("new").innerHTML = "<a href='#' style='color:#ffffff;'>Add Your Own Wish!</a>"; } } //***** ASSIGN/CHANGE VALUES AND TABS ***** function assignCategory(cat){ document.form.category.value=cat; } function onLoadAssignAndSwitch(cat){ assignCategory(cat); tabsClass.addTabs("tab_nav_container"); var initialTab = "tab_" + cat + "_data" if (initialTab != "tab_1_data"){ document.getElementById(initialTab).style.display = ""; document.getElementById("tab_1_data").style.display = "none"; } document.getElementById("tab_" + cat).className = "tabs_on"; } function assignAndSwitch(element, cat){ tabsClass.switchTab(element); assignCategory(cat); } //***** TABBED MENU ***** var tabsClass = { tabSetArray: new Array(), classOn: "tabs_on", classOff: "tabs_off", addTabs: function (tabsContainer) { tabs = document.getElementById(tabsContainer).getElementsByTagName("div"); for (x in tabs) { if (typeof(tabs[x].id) != "undefined") { this.tabSetArray.push(tabs[x].id); } else {} } }, switchTab: function (element) { for (x in this.tabSetArray) { tabItem = this.tabSetArray[x]; dataElement = document.getElementById(tabItem + "_data"); if (dataElement) { if (dataElement.style.display != "none") { dataElement.style.display = "none"; } else {} } else {} tabElement = document.getElementById(tabItem); if (tabElement) { if (tabElement.className != this.classOff) { tabElement.className = this.classOff; } else {} } else {} } document.getElementById(element.id + "_data").style.display = ""; element.className = this.classOn; } }; I'm not that advanced in javascript (although not a total idiot) Any help and/or suggestions would be greatly appreciated! Thank you! Hi there, I've been scouring the web and my mind for the last 24 hours trying to find a script that will work for what I need. It seems like it would be something super simple. I need visitors to my site to be able to search if we offer service in their area. i.e. Enter Zip Code: [Search Field] (Submit Button) Pop-up results or a results page with one of two responses. Yes, we offer service. No, we do not cover your area. Something similar to what this company has on their site, http://www.oilpatchfuel.com/Pages/Welcome.aspx Any help is a greatly GREATLY appreciated!! Goodafternoon! What im trying to do is get the users location (from the iPhone) which I have working and store it in a MySQL database (semi works). My problem is that to get the location, you need to use javascript. So I thought of using Ajax to post that back to the server. I have very little knowledge in Javascript, and Ajax, so this has been a bit of a struggle. Iv tried to learn how to do it with a tutorial: http://www.tizag.com/ajaxTutorial/ajax-javascript.php And this is what I got: PHP Code: <?php function is_iPhone($agent='') { if(empty($agent)) $agent = $_SERVER['HTTP_USER_AGENT']; if(!empty($agent) and preg_match("~Mozilla/[^ ]+ \((iPhone|iPod); U; CPU [^;]+ Mac OS X; [^)]+\) AppleWebKit/[^ ]+ \(KHTML, like Gecko\) Version/[^ ]+ Mobile/[^ ]+ Safari/[^ ]+~",$agent,$match)) { return "YES"; } elseif(stristr($agent,'iphone') or stristr($agent,'ipod')){ return "MAYBE"; } else { return "NO"; } } echo is_iPhone(); ?> <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>iPhone 3.0 geolocation demo</title> <meta content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" name="viewport"/> </head> <body> <script language="javascript" type="text/javascript"> <!-- //Browser Support Code function ajaxFunction(){ var ajaxRequest; // The variable that makes Ajax possible! try{ // Opera 8.0+, Firefox, Safari ajaxRequest = new XMLHttpRequest(); } catch (e){ // Internet Explorer Browsers try{ ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try{ ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e){ // Something went wrong alert("Your browser broke!"); return false; } } } // Create a function that will receive data sent from the server ajaxRequest.onreadystatechange = function(){ if(ajaxRequest.readyState == 4){ document.myForm.time.value = ajaxRequest.responseText; } } ajaxRequest.open("GET", "UpdateLog.php?lat=" + Lat + "&long=" + Long + "&acc=" + Acc, true); ajaxRequest.send(null); } //--> var Lat = "" var Long = "" var Acc = "" function handler(location) { var message = document.getElementById("message"); message.innerHTML ='<img src="http://maps.google.com/maps/api/staticmap?center=' + location.coords.latitude + ',' + location.coords.longitude + '&zoom=12&size=400x400&markers=color:blue|label:S|'+ location.coords.latitude +','+ location.coords.longitude +'&sensor=true" alt="some_text"/>'; message.innerHTML+="<p>Longitude: " + location.coords.longitude + "</p>"; message.innerHTML+="<p>Latitude: " + location.coords.latitude + "</p>"; message.innerHTML+="<p>Accuracy: " + location.coords.accuracy + "</p>"; Lat = location.coords.latitude Long = location.coords.longitude Acc = location.coords.accuracy } navigator.geolocation.getCurrentPosition(handler); ajaxFunction(); </script> <div id="message">Location unknown</div> <a href="#" onclick="ajaxFunction();" >Send</a> </body> </html> Now this works if the user clicks on "Send" that I made, but I want it to do it without the user having to click send. If anyone could help me with this, or point me in a different direction that would be better then your help would be greatly appreciated. Thanks in advance for your help. EDIT: The PHP side of this works, that is something I know about lol. <p> <script type="text/javascript">// <![CDATA[ var metrics = { "mm" : 1, "cm" : 10, "m" : 1000, "inch" : 25.4, "foot" : 304.8 }; function convert(num, dec){ var val = document.getElementById("fromVal").value; if(isNaN(val)){ return } function roundNumber(num, dec) { var result = Math.round( Math.round( num * Math.pow( 10, dec + 1 ) ) / Math.pow( 10, 1 ) ) / Math.pow(10,dec); return result; } document.getElementById("toVal").value = val * metrics[document.getElementById("fromSystem").value]/ metrics[document.getElementById("toSystem").value]; } var interval = null; function watchChanges(){ interval == null ? setInterval("convert()", 500) : clearInterval(interval); } // ]]></script> </p> <table> <tbody> <tr> <td><input id="fromVal" style="width: 100px;" onfocus="watchChanges()" onblur="watchChanges()" type="text" /><select id="fromSystem" onchange="convert()"> <option value="mm">millimeters</option> <option selected="selected" value="cm">centimeters</option> <option value="m">meters</option> <option value="foot">feet</option> <option value="inch">inches</option> </select></td> </tr> <tr> <td colspan="1" align="center">=</td> </tr> <tr> <td><input id="toVal" style="width: 100px;" type="text" disabled="disabled" /><select id="toSystem" onchange="convert()"> <option value="mm">millimeters</option> <option value="cm">centimeters</option> <option value="m">meters</option> <option selected="selected" value="foot">feet</option> <option value="inch">inches</option> </select></td> |