Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    May 2012
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    imgbubble and anythingslider wont work together

    Hi, there...

    I'm new to this forum - and just starting on working with both css and js, so bare with me

    I can't make my two jquery scripts work together, and I'm need of detailed help.

    Here's my html
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    
    <html>
    <head>
    
    
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    
    <meta http-equiv="Content-Type" content="cache" />
    <meta name="robots" content="INDEX, FOLLOW" />
    <meta name="keywords" content="ENTER KEYWORD" />
    <meta name="description" content="ENTER DESCRIPTOPN HERE" />
    
    
    <title>BLOGGEN</title>
    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
    <script type="text/javascript" src="js/slider/jquery.easing.1.2.js"></script>
    <script type="text/javascript" src="js/slider/slider.js"></script>
    <script src="js/slider/jquery.anythingslider.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
    
    <link href="css/styles.css" rel="stylesheet" type="text/css" media="screen">
    
    <link rel="stylesheet" href="css/slider/page.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="css/slider/anythingslider.css" type="text/css" media="screen" />
    
    
    
    
    
    <!-- Anythingslider -->
    <script type="text/javascript">
    
    var slider1 = ['april', 'maj', 'juni', 'Quote #2', 'Image #2'];
    function formatText(index, panel) {
    	return slider1[index - 1] || index;
    }
     
    
    </script>
    
    <!-- /*****SCRIPT FOR BUBBLE****/ -->
    <LINK rel=stylesheet type=text/css href="css/topmenu/imgbubbles.css">
    <LINK rel=stylesheet type=text/css href="css/topmenu/bubbles.css">
    
    
    
    
    <script type="text/javascript" src="js/topmenu/imgbubbles.js">
    /*****SCRIPT FOR BUBBLE****/
    /***********************************************
    * Image Bubbles effect- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
    ***********************************************/
    </script>
    <script type="text/javascript">
    jQuery(document).ready(function($){
    	$('ul#orbs').imgbubbles({factor:1.55}) //add bubbles effect to UL id="orbs"
    	$('ul#orbs_2').imgbubbles({factor:1.55}) //add bubbles effect to UL id="orbs_2"
    })
    </script>
    
    </head>
    
    
    
    <body>
    <div id="fb-root"></div>
    
    
    <div id="space" class="border">
    <div id="paper">
    	
     
        
        <div id="banner" align=center> 
    		<img src="images/layout/banner.png" />
        </div>
    
    
        <div id="menu" align="center">
    		<UL id=orbs class=bubblewrap>
    		<LI>
    			<A href="/dw.html"><IMG alt=HJEM src="images/layout/topmenu/hjem.png"></A>
                
           	</LI>
    		
            <LI>
                <A href="/om_mig.html"><IMG alt="OM MIG" src="images/layout/topmenu/ommig.png"></A>
                
    		</LI>
            
            <LI>
                <A href="/galleri.html"><IMG alt=GALLERI src="images/layout/topmenu/galleri.png"></A>
                
            </LI>
            
            <LI>
                <A href="/portefolio.html"><IMG alt=PORTEFOLIO src="images/layout/topmenu/portefolio.png"></A>
                
            </LI>
            
            <LI>
                <DIV><A href="/blog.html"><IMG alt=BLOG src="images/layout/topmenu/blog.png"></A>
                </DIV>
            </LI>
    		</UL>
        </div>
    
        
    <div id="page-wrap">
    
    <!-- AnythingSlider #1 -->
    <ul id="slider1">
    
    <li class="panel1">
    <div >
    <p>Denne scrollbar er simpel at bruge og kr&aelig;ver ikke billeder.
            <br> 
            Det er muligt at &aelig;ndre p&aring; farve, skygge, l&aelig;ngde og bredde.
            <br>
            Den kan dog v&aelig;re blogged i nogle browsere. (f.eks. IE). 
            <br>
            Hvis du oplever dette, m&aring; du meget gerne skrive til mig.
            <br>
            <br>
            <b>Scrollbaren benytter jQuery:</b>
            <br><a href="js/slimbox/162_jquery.min.js" target="_blank">1.6.2/jquery.min.js</a>
            <br><a href="js/scrollbar/jquery.mousewheel.min.js" target="_blank">jquery.mousewheel.min.js</a>
            <br>
            <br>        
            <h3><i><font color="#91968b"><b>Teknisk:</b>
            <br>
            Jeg har flyttet STYLE text over i min css.
            <br>
            Jeg har downloaded jquery.min.js fra adressen, s&aring; den ligger p&aring; samme server som Tegnehulen.</font></i></h3>
            </p>
            	 <div align=right > <A title="find scrollbar her" href="http://www.dynamicdrive.com/dynamicindex11/scrollc.htm" target="_blank"><IMG class=image_frame_link src="images/layout/links/dynamiccdrive2.gif"></A>                   
           	  </div>                  
           	  
    </div>
    </li>
    
    <li class="panel2">
    <div class="quoteSlide">
    <blockquote>In awe I watched the waxing moon ride across the zenith of the heavens like an ambered chariot towards the ebon void of infinite space wherein the tethered belts of Jupiter and Mars hang forever festooned in their orbital majesty. And as I looked at all this I thought... I must put a roof on this lavatory.<br>-- Les Dawson</blockquote>
    </div>
    </li>
    
    <li class="panel3">
    <img src="images/slider/slide-tele-1.jpg" alt="" />
    </li>
    
    <li class="panel4">
    <div class="quoteSlide">
    <blockquote>Life is conversational. Web design should be the same way. On the web, you&rsquo;re talking to someone you&rsquo;ve probably never met &ndash; so it&rsquo;s important to be clear and precise. Thus, well structured navigation and content organization goes hand in hand with having a good conversation.</blockquote>
    <p> - <a id='perma' href='http://quotesondesign.com/chikezie-ejiasi/'>Chikezie Ejiasi</a></p>
    </div>
    </li>
    
    <li class="panel5">
    <img src="images/slider/slide-tele-2.jpg" alt="" />
    </li>
    
    </ul> <!-- END AnythingSlider #2 -->
    
    
    </div>
    
        <div id="footer">
    		<p class="footer-text">Copyright by MD - Latest update april, 2012</p>
        </div>
    
    </div>
    </div>
    
    </body>
    </html>
    And the testpage is here: test

    The original anythingslider is here: slider

    Can you guide me through this?

  • #2
    New to the CF scene
    Join Date
    May 2012
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thanks

    I found this post, and that helped. Thanks

    solution


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •