Inserting jQuery code into HTML

Question

I have a pretty simple question. I'm trying to insert this infinite carousel jQuery script into my HTML file: http://www.catchmyfame.com/catchmyfame-jquery-plugins/jquery-infinite-carousel-plugin/

I can't seem to figure out how to get it in there though. No matter what I've tried, the script yields no result. Can anyone help? I've never used jQuery before. Here is my code (it has a master page):

<%@ Page Title="" Language="C#" MasterPageFile="~/advisor.master" %>

<script runat="server">

</script>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="js/infinitecarousel/jquery.infinitecarousel3.js"></script>      
<script type="text/javascript">
    $(function () {
        $('#carousel').infiniteCarousel();
    });

</script>   

    <style>        
    </style>


    <div id="carousel"></div>
    <ul>
    <li><img alt="" class="auto-style1" src="image1.jpg" /></li>
    <li><img alt="" class="auto-style1" src="image2.jpg" /></li>
    <li><img alt="" class="auto-style1" src="image3.jpg" /></li>
   </ul>

</asp:Content>

@scrowler no...the IIFE is intended and is correct. Used to insulate against possible other alias using $ like prototype.js or mootools. This is expected for all jQuery plugins — charlietfl
– charlietfl, Commented Dec 9, 2013 at 0:58
@GoldenEarring the code you are showing should already be in jquery.infinitecarousel3.min.js. You need to write initialization code for the plugin per the plugin docs. — charlietfl
– charlietfl, Commented Dec 9, 2013 at 1:01
I honestly am not sure how to do that. I made an adjustment in my original code. Am I on the right track? — GoldenEarring
– GoldenEarring, Commented Dec 9, 2013 at 1:44
yes..absolutely, then you pass in options object based on docs also. Not sure if plugin needs to be initated on your <UL> or not. Am not familiar with the plugin itself. Docs should provide ideal html layout — charlietfl
– charlietfl, Commented Dec 9, 2013 at 1:58

greenish · Accepted Answer · 2013-12-09 02:23:41Z

1

The only error I can see in your code is that you initialize the carousel on an empty div <div id="carousel"></div>.

Try this instead:

<!--<div id="carousel"></div> -->
<ul id="carousel">
    <li><img alt="" class="auto-style1" src="image1.jpg" /></li>
    <li><img alt="" class="auto-style1" src="image2.jpg" /></li>
    <li><img alt="" class="auto-style1" src="image3.jpg" /></li>
</ul>

Apart from that, if you implemented the plugin and jQuery correctly, and it looks like you did, and placed the files of the plugin where they're supposed to be, I can't see any reason why it shouldn't work.

answered Dec 9, 2013 at 2:23

greenish

1,0421 gold badge8 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Inserting jQuery code into HTML

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related