Results 1 to 10 of 10

Thread: Ultimate Fade-in ERROR: DIV with ID "fadeshow1" not found on page."

  1. #1
    Join Date
    Jun 2010
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Ultimate Fade-in ERROR: DIV with ID "fadeshow1" not found on page."

    1) Script Title: Ultimate Fade-in slideshow (v2.4)

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...nslideshow.htm

    3) Describe problem:

    No problem on this page: http://thefantasyfootballjunkie.com/ which is where I want the slideshow, however when I look at this page (where I don't want the slideshow): http://thefantasyfootballjunkie.com/blog I get the following error: "Error: DIV with ID "fadeshow1" not found on page."

    I believe I followed the directions correctly. I'm using Wordpress, this is my practice site prior to moving it to http://www.familyfanclub.net where I was using v 1.5 of the same script with no issues.

    Any suggestions on getting rid of the error? I'm new, please be kind.

  2. #2
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    it's because you have the javascript for the slideshow on the page without having the <div id="fadeshow1"></div> that it is referring to. The best solution would be to remove the script and the link to the fadeslideshow.js file from the page in question, and only have it on pages where it is needed, but that may well prove to be a little bit tricky in wordpress. An easy fix could be to put something like this in the body section of the page somewhere:
    <div id="fadeshow1" style="display:none;"></div>
    I would expect that to get rid of the error.
    Last edited by azoomer; 06-29-2010 at 09:30 PM.

  3. #3
    Join Date
    Jun 2010
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Hi azoomer, thanks for the suggestion, however that didn't work.

    Has anyone gotten this script to work with wordpress?

  4. #4
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    Hi Familyfanclub. I have this script working fine on several wordpress installations.
    Right now I am looking at your sourcecode for the blog. You still have this
    Code:
    <script type="text/javascript" src="Blog%20%C2%AB%20Family%20Fan%20Club,%20LLC_files/fadeslideshow.js">
        
        /***********************************************
        * Ultimate Fade In Slideshow v2.0- (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">
        
        var mygallery=new fadeSlideShow({
            wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
            dimensions: [670, 275], //width/height of gallery in pixels. Should reflect dimensions of largest image
            imagearray: [
                ["http://www.familyfanclub.net/images/triathlonsectionbanner.png", "http://www.cafepress.com/familyfanclub/4090790", "", ""],
    			["http://www.familyfanclub.net/images/customsectionbanner.png", "http://www.cafepress.com/familyfanclub/4091103", "", ""],			
                ["http://www.familyfanclub.net/images/TNTsectionbanner.png", "http://www.cafepress.com/familyfanclub/6857140", "", ""],	
                ["http://www.familyfanclub.net/images/runningsectionbanner.png", "http://www.cafepress.com/familyfanclub/4087529", "", ""],
                ["http://www.familyfanclub.net/images/cyclingsectionbanner.png", "http://www.cafepress.com/familyfanclub/4090807", "", ""],
                ["http://www.familyfanclub.net/images/swimsectionbanner.png", "http://www.cafepress.com/familyfanclub/4090809", "", ""]//<--no trailing comma after very last image element!
            ],
    		displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
            persist: false, //remember last viewed slide and recall within same session?
            fadeduration: 500, //transition duration (milliseconds)
            descreveal: "ondemand",
            togglerid: ""
        })
    
    	</script>
    on that page. And you still do not have this
    <div id="fadeshow1"></div>
    or this
    <div id="fadeshow1" style="display:none;"></div>
    on the page.
    That is the reason you are still getting the error

  5. #5
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    The way I use it in wordpress is in connection with a child theme and the javescript for the slideshow is only inserted on the particular page where it is needed with a conditional statement like this in the functions.php
    Code:
    function js_in_head(){
    if(is_front_page()){?>
    
    <script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/fadeslideshow.js"></script>
    
    <?php }}
    add_action('wp_head', 'js_in_head');
    And I do the same for the other part of the slideshow script ( the part with the dynamic drive credit)
    If that will work or not on your wp installation is depending on your configuration, file structure and the way you edit your template. So more info on that will probably be needed to get this working on your site.
    Last edited by azoomer; 06-30-2010 at 06:52 AM.

  6. #6
    Join Date
    Jun 2010
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Azoomer,

    Thanks again for your responses, however I'm not "getting" it.

    I'm using a modified Kubrick theme to display the front page as static and putting my posts on the Blog page. I only want the slide show to show up on the front page. I also plan to have many other pages on this site, where I don't want the slide show.

    I understand that the code is wanting / looking for the <div id="fadeshow1"></div>, just not sure how to make that go away / resolve the error, while still displaying the slide show on the front page.

    I tried to add this to the Blog page in the html: <div id="fadeshow1"></div>
    <div id="fadeshow1" style="display:none;"></div> saved and refreshed page and no change.

    I tried to add this to the About Us page (/about-us) and now it displays the slideshow, which I don't want.

    I also added the function in last post to functions.php file and removed the line from the header.php file that calls the script. Do I need to add something in the header.php to call the function in the functions.php file? (Very noobie I know).

    Anyway, thanks again for your help. If this is salvageable, appreciate your continued assistance.

  7. #7
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    the script is only looking for the Id so just putting
    <div id="fadeshow1" style="display:none;"> on the page should remove the error.
    However it would be a waste to have the script on all pages on the entire website if you only need it on the frontpage. I could see that you were trying out some stuff and you were getting closer. But as I said before it's a little bit tricky in wp. I still feel that the best solution is to put the script only where it is needed( the frontpage ). You dont need to call it in the header.php it should be sufficient to use this

    Code:
    function js_in_head(){
    if(is_front_page()){?>
    
    <script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/fadeslideshow.js">
    /***********************************************
    * Ultimate Fade In Slideshow v2.0- (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" src="<?php echo get_stylesheet_directory_uri(); ?>/js/imagearray.js"></script>
    
    <?php }}
    add_action('wp_head', 'js_in_head');
    In the functions.php
    then you would create a new js file called imagearray.js and put this part inside
    Code:
     
    
    var mygallery=new fadeSlideShow({
            wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
            dimensions: [670, 275], //width/height of gallery in pixels. Should reflect dimensions of largest image
            imagearray: [
                ["http://www.familyfanclub.net/images/triathlonsectionbanner.png", "http://www.cafepress.com/familyfanclub/4090790", "", ""],
    			["http://www.familyfanclub.net/images/customsectionbanner.png", "http://www.cafepress.com/familyfanclub/4091103", "", ""],			
                ["http://www.familyfanclub.net/images/TNTsectionbanner.png", "http://www.cafepress.com/familyfanclub/6857140", "", ""],	
                ["http://www.familyfanclub.net/images/runningsectionbanner.png", "http://www.cafepress.com/familyfanclub/4087529", "", ""],
                ["http://www.familyfanclub.net/images/cyclingsectionbanner.png", "http://www.cafepress.com/familyfanclub/4090807", "", ""],
                ["http://www.familyfanclub.net/images/swimsectionbanner.png", "http://www.cafepress.com/familyfanclub/4090809", "", ""]//<--no trailing comma after very last image element!
            ],
    		displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
            persist: false, //remember last viewed slide and recall within same session?
            fadeduration: 500, //transition duration (milliseconds)
            descreveal: "ondemand",
            togglerid: ""
        })
    And save the file in same directory as the fadeslideshow .js

    If the conditional function ( js_in_head) is placed in the functions.php it should place both of the needed files in the head section of the front page. you may have to experiment a bit to get the file paths right. The last thing you need is to put the <div id="fadeshow1"></div> the rigth place on the frontpage, but you have that right already. If you succeed in this way of doing it you will avoid slowing down your site by loading the script on all the other pages where it is not needed.
    I must admit that it is a bit difficult to explain this. Obviously there are many ways to achieve the result you are after. I'm just trying to explain how I did it.
    Last edited by azoomer; 06-30-2010 at 04:44 PM. Reason: moving te credit note to a better position

  8. The Following User Says Thank You to azoomer For This Useful Post:

    familyfanclub (06-30-2010)

  9. #8
    Join Date
    Jun 2010
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Azoomer, problem solved with the last suggestion.

    I also had to add

    Code:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    to this:

    Code:
    function js_in_head(){
    if(is_front_page()){?>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/fadeslideshow.js">
    /***********************************************
    * Ultimate Fade In Slideshow v2.0- (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" src="<?php echo get_stylesheet_directory_uri(); ?>/js/imagearray.js"></script>
    
    <?php }}
    add_action('wp_head', 'js_in_head');
    and now it works exactly like I wanted it to. Thank you very much for your help.

    Paul

  10. #9
    Join Date
    Oct 2009
    Posts
    845
    Thanks
    14
    Thanked 189 Times in 188 Posts

    Default

    Yes I see you got it right. Well done.

  11. #10
    Join Date
    Sep 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I get the same error, but only in one situation, that of using Safari. All other browsers, regardless of OS, this script works fine. In Safari, I get the error messages referring to each of the div id's defined in the page, and you click through those error message boxes, and the website appears - minus the images of course.

    suggestions?

    Quote Originally Posted by azoomer View Post
    it's because you have the javascript for the slideshow on the page without having the <div id="fadeshow1"></div> that it is referring to. The best solution would be to remove the script and the link to the fadeslideshow.js file from the page in question, and only have it on pages where it is needed, but that may well prove to be a little bit tricky in wordpress. An easy fix could be to put something like this in the body section of the page somewhere:
    <div id="fadeshow1" style="display:none;"></div>
    I would expect that to get rid of the error.

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
  •