SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 41
  1. #1
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Change Text on click with jQuery - Please help

    Hi,

    Re this thread: http://www.sitepoint.com/forums/java...ry-554851.html

    I am unable to use this following code twice to change text...

    Code:
    $(this).text($(this).text() == 'More Details' ? 'Hide Details' : 'More Details');
    Please can some kind soul help me figure this out to change text for multiple ID's/Div's.

    Here's my code. Note, I haven't duplicated the javascript portion again as it breaks the first one that works.

    HTML

    Code:
    <a href="#" id="slick-toggle");">More Details</a>
    
    <br />
    <div id="myContent" style="background-color: #CCC; padding: 10px;">          <strong>Cover The Fretboard : Theory and Application on Guitar</strong> - <strong>By Ashley Smith
                                    </strong> 
                                    
              <br />
              <br />
                                    
              Contents: -
              <br /><br />
                                   
              <ul>                      
              * <em><strong>About The Author</strong></em>
                                    
              <br /><br /><br />
                                     
              * <em><strong>Study Sheet Notes</strong></em> <br />- Important info regarding some documents.                                
              <br /><br /><br />
                     
                                    
              * <em><strong>Notes On The Fretboard</strong></em> <br />- An easy way to find and identify any note on the neck.
              <br /><br /><br />
                                    
              * <em><strong>Warm Ups</strong></em> <br />- Before you start to play you must Warm Up.
                                    
                                    
              <br /><br /><br />
              * <em><strong>How To Tune The Guitar</strong></em> <br />- A guide to tuning your Guitar.
              <br /><br /><br />
              * <em><strong>Open Position and Moveable Chord Shapes</strong></em> <br />- Basic CAGED and EDCAG Chord Forms.
              <br /><br /><br />
              * <em><strong>Lead Patterns</strong></em> <br />- Common Lead Patterns.
              <br /><br /><br />
              * <em><strong>Pentatonic's</strong></em> <br />- Major, Minor and Blues.
              <br /><br /><br />
              * <em><strong>Arpeggio's</strong></em> <br />- Major, Minor, Diminished, Augmented, Major 7, Minor 7, Dominant 7.
              <br /><br /><br />
              * <em><strong>The Major Modes</strong></em> <br />- Major Scale Modes and patterns across the entire neck <br />(Ionian, Dorian, Phrygian, Lydian, Mixolydian, Aeolian, Locrian).
              <br /><br /><br />
              * <em><strong>Diatonic Modal Avoid Notes and Colour Tones</strong></em> <br />- Notes to avoid in scales, and the colour tones.
              <br /><br />
              </ul>                      
                                    
              </div>
    
    <br />
    <br />
    <br />
    
    <a href="#" id="slick-toggle1");">More Details</a>
    
    <br />
    <div id="myContent1" style="background-color: #CCC; padding: 10px;">          <strong>Cover The Fretboard : Theory and Application on Guitar</strong> - <strong>By Ashley Smith
                                    </strong> 
                                    
              <br />
              <br />
                                    
              Contents: -
              <br /><br />
                                   
              <ul>                      
              * <em><strong>About The Author</strong></em>
                                    
              <br /><br /><br />
                                     
              * <em><strong>Study Sheet Notes</strong></em> <br />- Important info regarding some documents.                                
              <br /><br /><br />
                     
                                    
              * <em><strong>Notes On The Fretboard</strong></em> <br />- An easy way to find and identify any note on the neck.
              <br /><br /><br />
                                    
              * <em><strong>Warm Ups</strong></em> <br />- Before you start to play you must Warm Up.
                                    
                                    
              <br /><br /><br />
              * <em><strong>How To Tune The Guitar</strong></em> <br />- A guide to tuning your Guitar.
              <br /><br /><br />
              * <em><strong>Open Position and Moveable Chord Shapes</strong></em> <br />- Basic CAGED and EDCAG Chord Forms.
              <br /><br /><br />
              * <em><strong>Lead Patterns</strong></em> <br />- Common Lead Patterns.
              <br /><br /><br />
              * <em><strong>Pentatonic's</strong></em> <br />- Major, Minor and Blues.
              <br /><br /><br />
              * <em><strong>Arpeggio's</strong></em> <br />- Major, Minor, Diminished, Augmented, Major 7, Minor 7, Dominant 7.
              <br /><br /><br />
              * <em><strong>The Major Modes</strong></em> <br />- Major Scale Modes and patterns across the entire neck <br />(Ionian, Dorian, Phrygian, Lydian, Mixolydian, Aeolian, Locrian).
              <br /><br /><br />
              * <em><strong>Diatonic Modal Avoid Notes and Colour Tones</strong></em> <br />- Notes to avoid in scales, and the colour tones.
              <br /><br />
              </ul>                      
                                    
              </div>

    Javascript

    Code:
    $(document).ready(function() {
     // hides the slickbox as soon as the DOM is ready
      $('#myContent').hide();
     // toggles the slickbox on clicking the noted link  
      $('#slick-toggle').click(function() {
        $('#myContent').slideToggle('normal');
          $(this).text($(this).text() == 'More Details' ? 'Hide Details' : 'More Details');
        return false;
          
     
          
      });
     
    });
    This how it looks...

    http://jsfiddle.net/m998n/48/

    Thanks very much in advance of a swift reply.

    Ash

    P.s. I got this code off the Internet and have no experience with Javascript, jQuery, CSS, HTML, etc... I'm a newbie.

  2. #2
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    I can get it to work if I duplicate the javascript again as show below, but surely there must be an easy way to select multiple targets from one function, so no need to write code numerous times?

    Code:
    $(document).ready(function() {
     // hides the slickbox as soon as the DOM is ready
      $('#myContent').hide();
     // toggles the slickbox on clicking the noted link  
      $('#slick-toggle').click(function() {
        $('#myContent').slideToggle('normal');
         
         if ($(this).html() === 'Hide Details') {
            $(this).html('More Details');
        } else {
            $(this).html('Hide Details');
        }
          
       
        return false;
          
     
          
      });
     
    });
    
    $(document).ready(function() {
     // hides the slickbox as soon as the DOM is ready
      $('#myContent1').hide();
     // toggles the slickbox on clicking the noted link  
      $('#slick-toggle1').click(function() {
        $('#myContent1').slideToggle('normal');
         
         if ($(this).html() === 'Hide Details') {
            $(this).html('More Details');
        } else {
            $(this).html('Hide Details');
        }
          
       
        return false;
          
     
          
      });
     
    });

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    There is. You can put the code in a function that accepts the content and toggler as function parameters.

    Code javascript:
    function initSlickbox(content, toggler) {
        // hides the slickbox as soon as the DOM is ready
        $(content).hide();
        // toggles the slickbox on clicking the noted link  
        $(toggler).click(function() {
            $(content).slideToggle('normal');
     
            if ($(this).html() === 'Hide Details') {
                $(this).html('More Details');
            } else {
                $(this).html('Hide Details');
            }
            return false;
        });
    }

    After which you can initialize one of them with:

    Code javascript:
    initSlickbox('#myContent', '#slick-toggle');
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  4. #4
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Red face

    Hi,

    Thank you for the swift reply, much appreciated.

    I am unsure where to put the code in reference to the above however. Sorry, I'm a newbie

    Do I need to change my div id's to content/toggle?

    I need all div's to hide when the DOM loads, have them slide toggle open when one clicks on them individually, and have their 'More Details' name change to 'Hide Details' when opened, and back to the former when closed.

    Thanks again for a step by step.

    Ash

  5. #5
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    I am unsure where to put the code in reference to the above however. Sorry, I'm a newbie

    Do I need to change my div id's to content/toggle?
    No, you don't need to change any of those.

    Would you like some hand-holding in regards to the changes that you need to make?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  6. #6
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes please, I think I'm just unsure where to place this function to call...

    initSlickbox('#myContent', '#slick-toggle');

    This is how it looks at the moment replacing code with yours minus the above...

    My Code

    Thanks again

  7. #7
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    Yes please, I think I'm just unsure where to place this function to call...

    initSlickbox('#myContent', '#slick-toggle');
    You can place that and the function inside of the jQuery ready function that you started with in the original post.

    And here's a tip that could become useful for you - this jQuery callback method:

    Code javascript:
    $(function() {
        ...
    });

    does exactly the same job as this jQuery ready handler:

    Code javascript:
    $(document).ready(function() {
        ...
    });
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  8. #8
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It doesn't seem to work in tests on this page...

    My Code

    I must be writing it out wrong, placing things in the wrong place.


  9. #9
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    It doesn't seem to work in tests on this page...

    My Code

    I must be writing it out wrong, placing things in the wrong place.

    If you're making changes the the contents of the initSlickbox function, then you're doing it wrong.

    The initSlickbox function goes inside of the jQuery ready function. Immediately after the end of the initSlickbox function (but still inside of the jQuery ready function) is where you place the call to initCheckbox initializing it for the different pieces of content that you have.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  10. #10
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry, I really don't understand the terminology, it's over my head.

    Could you kindly write out the working code for me. I think I can then follow it visually.

    Cheers

  11. #11
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    Could you kindly write out the working code for me.
    I would rather help you to understand what is going on here, so that you can come to learn more about how your code works.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  12. #12
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I understand and appreciate that.

    Here's what I have...

    JS

    Code:
    function initSlickbox(content, toggler) {
        // hides the slickbox as soon as the DOM is ready
        $(content).hide();
        // toggles the slickbox on clicking the noted link  
        $(toggler).click(function() {
            $(content).slideToggle('normal');
         
            if ($(this).html() === 'Hide Details') {
                $(this).html('More Details');
            } else {
                $(this).html('Hide Details');
            }
            return false;
            
            initSlickbox('#myContent', '#slick-toggle');
        });
    }

    HTML

    Code:
    <a href="#" id="slick-toggle");">More Details</a>
    
    <br />
    <div id="myContent" style="background-color: #CCC; padding: 10px;">          <strong>Cover The Fretboard : Theory and Application on Guitar</strong> - <strong>By Ashley Smith
                                    </strong> 
                                    
              <br />
              <br />
                                    
              Contents: -
              <br /><br />
                                   
              <ul>                      
              * <em><strong>About The Author</strong></em>
                                    
              <br /><br /><br />
                                     
              * <em><strong>Study Sheet Notes</strong></em> <br />- Important info regarding some documents.                                
              <br /><br /><br />
                     
                                    
              * <em><strong>Notes On The Fretboard</strong></em> <br />- An easy way to find and identify any note on the neck.
              <br /><br />
              </ul>                      
                                    
              </div>
    
    <br />
    <br />
    <br />
    
    <a href="#" id="slick-toggle1");">More Details</a>
    
    <br />
    <div id="myContent1" style="background-color: #CCC; padding: 10px;">          <strong>Cover The Fretboard : Theory and Application on Guitar</strong> - <strong>By Ashley Smith
                                    </strong> 
                                    
              <br />
              <br />
                                    
              Contents: -
              <br /><br />
                                   
              <ul>                      
              * <em><strong>About The Author</strong></em>
                                    
              <br /><br /><br />
                                     
              * <em><strong>Study Sheet Notes</strong></em> <br />- Important info regarding some documents.                                
              <br /><br /><br />
                     
                                    
              * <em><strong>Notes On The Fretboard</strong></em> <br />- An easy way to find and identify any note on the neck.
              <br /><br /><br />
                                    
              * <em><strong>Warm Ups</strong></em> <br />- Before you start to play you must Warm Up.
                                    
                                    
              <br /><br /><br />
              * <em><strong>How To Tune The Guitar</strong></em> <br />- A guide to tuning your Guitar.
              <br /><br /><br />
              * <em><strong>Open Position and Moveable Chord Shapes</strong></em> <br />- Basic CAGED and EDCAG Chord Forms.
              <br /><br /><br />
              * <em><strong>Lead Patterns</strong></em> <br />- Common Lead Patterns.
              <br /><br /><br />
              * <em><strong>Pentatonic's</strong></em> <br />- Major, Minor and Blues.
              <br /><br /><br />
              * <em><strong>Arpeggio's</strong></em> <br />- Major, Minor, Diminished, Augmented, Major 7, Minor 7, Dominant 7.
              <br /><br /><br />
              * <em><strong>The Major Modes</strong></em> <br />- Major Scale Modes and patterns across the entire neck <br />(Ionian, Dorian, Phrygian, Lydian, Mixolydian, Aeolian, Locrian).
              <br /><br /><br />
              * <em><strong>Diatonic Modal Avoid Notes and Colour Tones</strong></em> <br />- Notes to avoid in scales, and the colour tones.
              <br /><br />
              </ul>                      
                                    
              </div>
    At the moment the div's are open and not closed by default, and when you click on 'More Details' it neither changes name or opens/closes div.

    Please take a look at the example posted...

    My Code

    As you can see I have two div's to toggle... slick-toggle and slick-toggle1 (myContent and myContent1)

  13. #13
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    I understand and appreciate that.
    The following line:
    initSlickbox('#myContent', '#slick-toggle');
    should not be anywhere inside of the initSlickbox function. Instead, that line needs to occur after the end of function.

    Both the function and the line that invokes it still need to be wrapped by that jQuery wrapper that you started with in the original post.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  14. #14
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have no clue what you mean by jQuery wrapper, I thought I was putting that line in there.

    I now have...

    function initSlickbox(content, toggler) {
    // hides the slickbox as soon as the DOM is ready
    $(content).hide();
    // toggles the slickbox on clicking the noted link
    $(toggler).click(function() {
    $(content).slideToggle('normal');

    if ($(this).html() === 'Hide Details') {
    $(this).html('More Details');
    } else {
    $(this).html('Hide Details');
    }
    return false;


    });
    }

    initSlickbox('#myContent', '#slick-toggle');

  15. #15
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    I have no clue what you mean by jQuery wrapper
    Let's stop here before carrying on then.

    This part that wraps around the jQuery code, is commonly referred to as a jQuery wrapper.

    Code javascript:
    $(document).ready(function() {
        ...
    });

    It's purpose is to delay the execution of the code in the function, until after the DOM has loaded. At that time the script code in the function is then capable of working with the elements in the DOM.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  16. #16
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ah, I see. Sorry that's correct above. The code wasn't updating correctly on the website I'm using to test.

    Do I need to add an onLoad for the framework?

    Here's a picture...

    http://img293.imagevenue.com/img.php...122_432lo.tiff

  17. #17
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    Do I need to add an onLoad for the framework?
    You would use a jQuery wrapper to perform that task.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  18. #18
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here's what I have for my <head> at the top of my webpage...

    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>Store</title>
    
    <style media="all" type="text/css">@import url("menu/menu_style.css");</style>
    
    <style type="text/css">
    
    body 
    {
    	background-image: url(_images/background.jpg);
    	background-position: left top;
    }
    
    .style1 {color: #FFFFFF}
    </style>
    
    <link rel='stylesheet' type='text/css' media='all' id="payloom-custom-css" href='Store_files/block_1/payloom.css?v=73' />
    
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
    <script type="text/javascript">
    function initSlickbox(content, toggler) {
        // hides the slickbox as soon as the DOM is ready
        $(content).hide();
        // toggles the slickbox on clicking the noted link  
        $(toggler).click(function() {
            $(content).slideToggle('normal');
         
            if ($(this).html() === 'Hide Details') {
                $(this).html('More Details');
            } else {
                $(this).html('Hide Details');
            }
            return false;
            
            
        });
    }
    
    initSlickbox('#myContent', '#slick-toggle');
    initSlickbox('#myContent1', '#slick-toggle1');
    </script>
    
    </head>
    I think I need to change to jQuery 1.6 to get it to work as currently it shows div open.

    How do I do that?


  19. #19
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    I think I need to change to jQuery 1.6 to get it to work as currently it shows div open.
    The script code is currently being run before the sections that it's supposed to manipulate have even begun to exist.

    You need to put the script inside a jQuery wrapper, which will allow that code to run only after the content of the page has loaded.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  20. #20
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Do I thus place this in the body?

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js">

    function initSlickbox(content, toggler) {
    // hides the slickbox as soon as the DOM is ready
    $(content).hide();
    // toggles the slickbox on clicking the noted link
    $(toggler).click(function() {
    $(content).slideToggle('normal');

    if ($(this).html() === 'Hide Details') {
    $(this).html('More Details');
    } else {
    $(this).html('Hide Details');
    }
    return false;


    });
    }

    initSlickbox('#myContent', '#slick-toggle');
    initSlickbox('#myContent1', '#slick-toggle1');
    </script>

  21. #21
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    Do I thus place this in the body?
    No, leave it where it was and instead wrap that scripting code with the jQuery wrapper.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  22. #22
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have this... but it doesn't work.

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
    <script type="text/javascript">
    function initSlickbox(content, toggler) {
    // hides the slickbox as soon as the DOM is ready
    $(content).hide();
    // toggles the slickbox on clicking the noted link
    $(toggler).click(function() {
    $(content).slideToggle('normal');

    if ($(this).html() === 'Hide Details') {
    $(this).html('More Details');
    } else {
    $(this).html('Hide Details');
    }
    return false;


    });
    }

    initSlickbox('#myContent', '#slick-toggle');
    initSlickbox('#myContent1', '#slick-toggle1');
    </script>

  23. #23
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    I have this... but it doesn't work.
    The reason why it doesn't working, and the solution to getting it working, are in post #19
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  24. #24
    SitePoint Enthusiast
    Join Date
    Jun 2011
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm at a loss. I have tried placing

    <script type="text/javascript">

    after

    function initSlickbox(content, toggler) {

    and then closing the script before

    });
    }

    But I'm unsure what you mean again by placing it in the wrapper. Sorry.

  25. #25
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by Ashley Smith View Post
    But I'm unsure what you mean again by placing it in the wrapper. Sorry.
    There are some different types of them that we went through in post #7

    Here is one of them, again.

    Code javascript:
    $(document).ready(function () {
        ...
    });
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

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