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 12 of 12
  1. #1
    New Coder
    Join Date
    Nov 2003
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Type Issue undefined is not a function

    Hi. I am having some problems with a jQuery plugin which is throwing a "Type Issue undefined is not a function" error.

    I don't think I can send an attachment here, but I would appreciate if someone would message me and let me know how I could send them a zip file with my dev site (zipped, it is 592K) as it is not online.

    I am sure it is a simple issue, but I'm not sure how to solve it.

    Thanks,

    Ali

  • #2
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    Can you post some sample code of the function that is throwing the error?
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #3
    New Coder
    Join Date
    Nov 2003
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The plugin code is relatively simple.

    Code:
    (function($) {
    
        $.fn.polarisSlider = function(options) {
    
            // set default options
            var defaults = {
                speed : 1000,
                pause : 2000,
                transition : 'fade'
            },
    
            // Take the options that the user selects, and merge them with defaults.
            options = $.extend(defaults, options);
    
            // Needed to fix a tiny bug. If the pause is less than speed, it'll cause a flickr.
            // This will check for that, and if it is smaller, it increases it to just about the options.speed.
            if(options.pause <= options.speed) options.pause = options.speed + 100;
    
            // for each item in the wrapped set
            return this.each(function() {
    
                // cache "this."
                var $this = $(this);
    
                // Wrap "this" in a div with a class of "slider-wrap."
                $this.wrap('<div class="slider-wrap" />');
    
                // Set the width to a really high number. Adjusting the "left" css values, so need to set positioning.
                $this.css({
                        'width' : '99999px',
                        'position' : 'relative',
                        'padding' : 0
                    });
    
                    // If the user chose the "slide" transition...
                    if(options.transition === 'slide') {
                        $this.children().css({
                            'float' : 'left',
                            'list-style' : 'none'
                        });
    
                        $('.slider-wrap').css({
                            'width' : $this.children().width(),
                            'overflow' : 'hidden'
                        });             
                    }
    
                    // If the user chose the "fade" transition, instead pile all of the images on top of each other.
                    if(options.transition === 'fade') {
                        $this.children().css({
                            'width' : $this.children().width(),
                            'position' : 'absolute',
                            'left' : 0
                        });
    
                        // reorder elements to fix z-index issue.
    
                        for(var i = $this.children().length, y = 0; i > 0; i--, y++) {      
                            $this.children().eq(y).css('zIndex', i + 99999);
                        }   
    
                        // Call the fade function. 
                        fade();
                    }
    
                    // If the user instead chose the "slide" transition, call the slide function.
                    if(options.transition === 'slide') slide(); 
    
    
                    function slide() {
                        setInterval(function() {
                            // Animate to the left the width of the image/div
                            $this.animate({'left' : '-' + $this.parent().width()}, options.speed, function() {
                                // Return the "left" CSS back to 0, and append the first child to the very end of the list.
                                $this
                                   .css('left', 0)
                                   .children(':first')
                                   .appendTo($this); // move it to the end of the line.
                            })
                        }, options.pause);
                    } // end slide
    
                    function fade() {
                        setInterval(function() {
                            $this.children(':first').animate({'opacity' : 0}, options.speed, function() {   
                                $this
                                   .children(':first')
                                   .css('opacity', 1) // Return opacity back to 1 for next time.
                                   .css('zIndex', $this.children(':last').css('zIndex') - 1) // Reduces zIndex by 1 so that it's no longer on top.                  
                                   .appendTo($this); // move it to the end of the line.
                            })
                        }, options.pause);
                    } // end fade           
    
                }); // end each     
    
            } // End plugin. Go eat cake.
    
        })(jQuery);
    The html side of things is a ul that is in a div container:

    Code:
    <div class="slideshow">
        <ul id="slides">
            <li><img src="images/slide1/commercial-insurance-107807003.jpg" alt="Commercial Insurance"></li>
            <li><img src="images/slide1/employee-benefits-86250418.jpg" alt="Employee Benefits"></li>
            <li><img src="images/slide1/fine-arts-5384764.jpg" alt="Fine Arts"></li>
            <li><img src="images/slide1/personal-insurance-101341654.jpg" alt="Personal Insurance"></li>
            <li><img src="images/slide1/risk-management-96075848.jpg" alt="Risk Management Planning"></li>
        </ul>
    </div>
    And the script gets called using the following code:

    Code:
    <script type="text/javascript" charset="utf-8">
            $('ul#slides').polarisSlider({
                speed : 2500,
                pause : 3000
            });
    </script><!--End polarisSlider-->
    I can also send you a zip of the site. It isn't online.

  • #4
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    I cannot download zip files at work.

    Have you tried placing the last of your code samples inside the jQuery document ready state?
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #5
    New Coder
    Join Date
    Nov 2003
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm pretty much a newbie when it comes to jQuery and js in general, so your question went over my head as I have no idea what you mean by "jQuery document ready state"

  • #6
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    After you load the jQuery file, take your last bit of code:
    Code:
    <script type="text/javascript" charset="utf-8"> 
            $('ul#slides').polarisSlider({
                 speed : 2500,
                 pause : 3000
             }); 
    </script><!--End polarisSlider-->
    .. and do this with it:
    Code:
    <script type="text/javascript" charset="utf-8">
    
    $(document).ready(function(){
     $('ul#slides').polarisSlider({
                 speed : 2500,
                 pause : 3000
             });
    });
     </script><!--End polarisSlider-->
    This will prevent the polarisSlider from being called until after the whole document is loaded.
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #7
    New Coder
    Join Date
    Nov 2003
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Still getting the same error

  • #8
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    Hmmm.. I'm at a loss. Why would it think that "Type Issue undefined" is or is not a function??
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #9
    New Coder
    Join Date
    Nov 2003
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I wish there was someway I could get the site zip to you. If I upload the zip file it to a site and provide you the link, would you be able to download it?

  • #10
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    Security settings, here, prevent it.
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #11
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,454
    Thanks
    0
    Thanked 632 Times in 622 Posts
    Have you tried stepping through it line by line using the debugger built into your browser to find out which line of the code is giving the error?
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #12
    Senior Coder Dormilich's Avatar
    Join Date
    Jan 2010
    Location
    Behind the Wall
    Posts
    3,132
    Thanks
    12
    Thanked 332 Times in 328 Posts
    "Type Issue undefined is not a function" error
    I’d hazard a guess at that you somewhere are supposed to pass a function callback in another function, but don’t.
    The computer is always right. The computer is always right. The computer is always right. Take it from someone who has programmed for over ten years: not once has the computational mechanism of the machine malfunctioned.
    André Behrens, NY Times Software Developer


  •  

    Posting Permissions

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