Webmaster Forum

Go Back   Webmaster Forum > Web Development > Coding Forum

Coding Forum Problems with your code? Discuss coding issues, including JavaScript, PHP & MySQL, HTML & CSS, Flash & ActionScript, and more.


Reply
 
Thread Tools Display Modes
Share |
  #1  
Old 02-25-2010, 01:53 PM
Stretty Stretty is offline
Contributing Member
 
Join Date: 01-04-10
Posts: 111
iTrader: 3 / 100%
Two sets of jquery on one page

I'm really struggling with a design for a client.

There is a featured content slider at the top, and separate content slider in the sidebar.

I have got the one in the sidebar working, but the one at the top just lists all the images down the page instead of inside the slider and I can't figure out where I'm going wrong.

I'm not sure what the rules are about posting code directly onto the site, so if someone can help me out please let me know and I'll PM you.

Thanks.
 
Reply With Quote

Advertisement

Advertisement

  #2  
Old 02-25-2010, 02:19 PM
HTMLBasicTutor's Avatar
HTMLBasicTutor HTMLBasicTutor is offline
Administrator
 
Join Date: 10-29-07
Location: Canada
Posts: 26,710
iTrader: 5 / 100%
Quote:
Originally Posted by Stretty View Post
I have got the one in the sidebar working, but the one at the top just lists all the images down the page instead of inside the slider and I can't figure out where I'm going wrong.
Suspect it has to do with your associated CSS for this area.
Quote:
Originally Posted by Stretty View Post
I'm not sure what the rules are about posting code directly onto the site, so if someone can help me out please let me know and I'll PM you.

Thanks.
You can post code. Please use one of the 3 code buttons (#, <> or php) then paste your code inside the tags created.
 
Reply With Quote
  #3  
Old 03-10-2010, 11:25 AM
Stretty Stretty is offline
Contributing Member
 
Join Date: 01-04-10
Posts: 111
iTrader: 3 / 100%
I am experiencing this problem again on a separate webpage. I'm thinking maybe I'm doing something wrong on a fundamental level like referencing the js files in the wrong order.

I'll post the code below and see if anyone can spot any mistakes.

Again, both sets of jquery work perfectly well independently f the other. The problem only arises when they're put together on one page.

P.S.there are no validation errors. (I knew you were gonna look there first htmlbasictutor. )

HTML 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>Portfolio</title> <link href="style.css" rel="stylesheet" type="text/css" /> <!-- top content slider--> <script language="javascript" type="text/javascript" src="jquery-1.3.2.min.js"></script> <script language="javascript" type="text/javascript" src="jquery.flow.1.2.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#myController").jFlow({ slides: "#slides", controller: ".jFlowControl", // must be class, use . sign slideWrapper : "#jFlowSlide", // must be id, use # sign selectedWrapper: "jFlowSelected", // just pure text, no sign auto: true, //auto change slide, default true width: "610px", height: "235px", duration: 400, prev: ".jFlowPrev", // must be class, use . sign next: ".jFlowNext" // must be class, use . sign }); }); </script><!--top content slider--> <!--hover buttons--><script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".hover-menu a").hover(function() { $(this).next("em").animate({opacity: "show", top: "-75"}, "slow"); }, function() { $(this).next("em").animate({opacity: "hide", top: "-85"}, "fast"); }); }); </script><!--hover buttons--> </head> <body> <div id="wrapper"><!--wrapper--> <div id="header"><!--header--> <div id="header-box"> <!--<div id="logo"> <a href="/"><img src="http://www.v7n.com/forums/images/logo.png" alt="Home"/></a> </div><logo--> <div id="navigation"><!--navigation--> <div id="menu"> <ul> <li><a href="/" class="current">Home</a></li> <li><a href="/" >Website Design</a></li> <li><a href="/" >About</a></li> <li><a href="/" >Contact</a></li> </ul> </div> </div><!--navigation--> </div> </div><!-- #header --> <div style="clear:both;"></div> <div id="top-container"><!--top-container--> <div id="content"><!--content--> <div class="jflow-content-slider"> <div id="slides"> <div class="slide-wrapper"> <div class="slide-thumbnail"> <img src="http://www.v7n.com/forums/images/imprezz.jpg" alt="photo"/> </div> <div class="slide-details"> <h2>Imprezz Wordpress Theme</h2> <div class="description"> In this post we release Imprezz C a simple and beautiful 3-column-theme, a free WordPress theme designed by Gopal Raju from ProductiveDreams for Smashing Magazine and its readers. The theme can be used in various setting for various purposes - in magazine-blogs, but also in corporate and private blogs. </div> </div> <div class="clear"></div> </div> <div class="slide-wrapper"> <div class="slide-thumbnail"> <img src="http://www.v7n.com/forums/images/gallery.jpg" alt="photo"/> </div> <div class="slide-details"> <h2>Gallery Wordpress Theme</h2> <div class="description"> Gallery is a beautiful, free, gallery-style Thematic child theme for WordPress, designed by Christopher Wallace especially for Smashing Magazine and its readers. It is extremely flexible and can be used as a starting point for design galleries and portfolios. </div> </div> <div class="clear"></div> </div> <div class="slide-wrapper"> <div class="slide-thumbnail"> <img src="http://www.v7n.com/forums/images/magazeen.jpg" alt="photo"/> </div> <div class="slide-details"> <h2>Magazeen Wordpress Theme</h2> <div class="description"> Magazeen a free advanced Wordpress-theme in a magazine-llok created by the talented WeFunction Design Agency. This bold magazine 2-col-theme was designed with the main focus being on typography, grids and magazine-look. It was created especially for Smashing Magazine and its readers. </div> </div> <div class="clear"></div> </div> <div class="slide-wrapper"> <div class="slide-thumbnail"> <img src="http://www.v7n.com/forums/images/vintage.jpg" alt="photo"/> </div> <div class="slide-details"> <h2>Vintage Wordpress Theme</h2> <div class="description"> The themes include full PSD-templates and can be used without any restrictions whatsoever. The themes were commissioned by Smashing Magazine exclusively for our readers and designed by Wendell Fernandes. </div> </div> <div class="clear"></div> </div> <div class="slide-wrapper"> <div class="slide-thumbnail"> <img src="http://www.v7n.com/forums/images/blues.jpg" alt="photo"/> </div> <div class="slide-details"> <h2>Blues Wordpress Theme</h2> <div class="description"> This theme is a variation of the theme presented above; however, it tries not to focus on the vintage look but on a simple, clean, and user-friendly design. This theme was commissioned by Smashing Magazine exclusively for our readers and designed by the Dellustrations design agency. </div> </div> <div class="clear"></div> </div> </div> <div id="myController"> <span class="jFlowPrev">Prev</span> <span class="jFlowControl">1</span> <span class="jFlowControl">2</span> <span class="jFlowControl">3</span> <span class="jFlowControl">4</span> <span class="jFlowControl">5</span> <span class="jFlowNext">Next</span> </div> <div class="clear"></div> </div> </div><!--content--> </div><!--top-container--> <div id="bottom-container"><!--bottom-container--> <div id="bottom-container-box"> <div class="col"> <ul class="hover-menu"> <li> <a href="/">Starter Package</a> <em>For personal websites and small businesses</em> </li> </ul> <ul class="packages"> <li>4 page website</li> <li>Domain name</li> <li>Web Hosting</li> <li>3 email accounts</li> <li>Basic SEO</li> </ul> </div> <div class="col"> <ul class="hover-menu"> <li> <a href="/">Medium Package</a> <em>For medium sized businesses and busy websites</em> </li> </ul> <ul class="packages"> <li>6 page website</li> <li>Domain name</li> <li>Web Hosting</li> <li>5 email accounts</li> <li>Basic SEO</li> </ul> </div> <div class="col"> <ul class="hover-menu"> <li> <a href="/">Advanced Package</a> <em>For large businesses and popular websites</em> </li> </ul> <ul class="packages"> <li>8 page website</li> <li>Domain name</li> <li>Web Hosting</li> <li>10 email accounts</li> <li>Expert SEO</li> </ul> </div> </div> </div><!--bottom-container--> <div id="footer"><!--footer--> <div id="footer-content"><!--footer-content--> </div><!--footer-content--> </div><!--footer--> </div><!--wrapper--> </body> </html>
 
Reply With Quote
  #4  
Old 03-12-2010, 07:40 AM
Stretty Stretty is offline
Contributing Member
 
Join Date: 01-04-10
Posts: 111
iTrader: 3 / 100%
Can nobody solve this issue? I know it's something I'm doing wrong because I've seen loads of sites using more than one jquery element.
 
Reply With Quote
Go Back   Webmaster Forum > Web Development > Coding Forum

Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
multiple IP sets CapsLOCK Dedicated Servers 13 12-09-2009 04:19 AM
jQuery plugin using <ul> and <li> osec Coding Forum 2 12-08-2009 01:31 AM
how can i use jQuery? mint1 Coding Forum 3 07-28-2009 04:01 AM
Dinnerware sets John Scott Forum Lobby 28 03-18-2008 02:00 PM
frustration sets in gump2773 Web Design Lobby 2 09-08-2006 06:14 AM


V7N Network
Get exposure! V7N I Love Photography V7N SEO Blog V7N Directory


All times are GMT -7. The time now is 09:19 PM.
Powered by vBulletin
Copyright 2000-2014 Jelsoft Enterprises Limited.
Copyright © 2003 - 2018 VIX-WomensForum LLC