Chatbox déroulante ne fonctionne plus

[Yoshkill]

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Autre
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : récemment
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Salut !

J'utilise des javascripts pour afficher une chatbox déroulante sur mon forum.

Mais depuis quelques temps, elle ne s'affiche plus correctement. Elle apparaît fixée en haut du forum, alors qu'elle devrait n'apparaître que lorsqu'on clique sur l'icone en bas à gauche de la page (non-affichée actuellement).

Voici les .js utilisés :

Code:

$(function(){
                        $('.slide-out-div').tabSlideOut({
                            tabHandle: '.handle',                    //class of the element that will become your tab
                            pathToTabImage: 'http://i.imgur.com/whXWTGX.png', //path to the image for the tab //Optionally can be set using css
                            imageHeight: '340px',                    //height of tab image          //Optionally can be set using css
                            imageWidth: '49px',                      //width of tab image            //Optionally can be set using css
                            tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left
                            speed: 300,                              //speed of animation
                            action: 'click',                          //options: 'click' or 'hover', action to trigger animation
                            topPos: '20px',                          //position from the top/ use if tabLocation is left or right
                            fixedPosition: true                      //options: true makes it stick(fixed position) on scroll
                        });
             
                    });

Code:

/*
                    tabSlideOUt v1.3
               
                    By William Paoli: http://wpaoli.building58.com
             
                    To use you must have an image ready to go as your tab
                    Make sure to pass in at minimum the path to the image and its dimensions:
               
                    example:
               
                        $('.slide-out-div').tabSlideOut({
                                tabHandle: '.handle',                        //class of the element that will be your tab -doesnt have to be an anchor
                                pathToTabImage: 'images/contact_tab.gif',    //relative path to the image for the tab
                                imageHeight: '133px',                        //height of tab image
                                imageWidth: '44px',                          //width of tab image
                        });
             
                    or you can leave out these options
                    and set the image properties using css
               
                */
             
             
                (function($){
                    $.fn.tabSlideOut = function(callerSettings) {
                        var settings = $.extend({
                            tabHandle: '.handle',
                            speed: 300,
                            action: 'click',
                            tabLocation: 'left',
                            topPos: '200px',
                            leftPos: '20px',
                            fixedPosition: false,
                            positioning: 'absolute',
                            pathToTabImage: null,
                            imageHeight: null,
                            imageWidth: null,
                            onLoadSlideOut: false                 
                        }, callerSettings||{});
             
                        settings.tabHandle = $(settings.tabHandle);
                        var obj = this;
                        if (settings.fixedPosition === true) {
                            settings.positioning = 'fixed';
                        } else {
                            settings.positioning = 'absolute';
                        }
                   
                        //ie6 doesn't do well with the fixed option
                        if (document.all && !window.opera && !window.XMLHttpRequest) {
                            settings.positioning = 'absolute';
                        }
                   
             
                   
                        //set initial tabHandle css
                   
                        if (settings.pathToTabImage != null) {
                            settings.tabHandle.css({
                            'background' : 'url('+settings.pathToTabImage+') no-repeat',
                            'width' : settings.imageWidth,
                            'height': settings.imageHeight
                            });
                        }
                   
                        settings.tabHandle.css({
                            'display': 'block',
                            'textIndent' : '-99999px',
                            'outline' : 'none',
                            'position' : 'absolute'
                        });
                   
                        obj.css({
                            'line-height' : '1',
                            'position' : settings.positioning
                        });
             
                   
                        var properties = {
                                    containerWidth: parseInt(obj.outerWidth(), 10) + 'px',
                                    containerHeight: parseInt(obj.outerHeight(), 10) + 'px',
                                    tabWidth: parseInt(settings.tabHandle.outerWidth(), 10) + 'px',
                                    tabHeight: parseInt(settings.tabHandle.outerHeight(), 10) + 'px'
                                };
             
                        //set calculated css
                        if(settings.tabLocation === 'top' || settings.tabLocation === 'bottom') {
                            obj.css({'left' : settings.leftPos});
                            settings.tabHandle.css({'right' : 0});
                        }
                   
                        if(settings.tabLocation === 'top') {
                            obj.css({'top' : '-' + properties.containerHeight});
                            settings.tabHandle.css({'bottom' : '-' + properties.tabHeight});
                        }
             
                        if(settings.tabLocation === 'bottom') {
                            obj.css({'bottom' : '-' + properties.containerHeight, 'position' : 'fixed'});
                            settings.tabHandle.css({'top' : '-' + properties.tabHeight});
                       
                        }
                   
                        if(settings.tabLocation === 'left' || settings.tabLocation === 'right') {
                            obj.css({
                                'height' : properties.containerHeight,
                                'bottom' : settings.topPos
                            });
                       
                            settings.tabHandle.css({'bottom' : 0});
                        }
                   
                        if(settings.tabLocation === 'left') {
                            obj.css({ 'left': '-' + properties.containerWidth});
                            settings.tabHandle.css({'right' : '-' + properties.tabWidth});
                        }
             
                        if(settings.tabLocation === 'right') {
                            obj.css({ 'right': '-' + properties.containerWidth});
                            settings.tabHandle.css({'left' : '-' + properties.tabWidth});
                       
                            $('html').css('overflow-x', 'hidden');
                        }
             
                        //functions for animation events
                   
                        settings.tabHandle.click(function(event){
                            event.preventDefault();
                        });
                   
                        var slideIn = function() {
                       
                            if (settings.tabLocation === 'top') {
                                obj.animate({top:'-' + properties.containerHeight}, settings.speed).removeClass('open');
                            } else if (settings.tabLocation === 'left') {
                                obj.animate({left: '-' + properties.containerWidth}, settings.speed).removeClass('open');
                            } else if (settings.tabLocation === 'right') {
                                obj.animate({right: '-' + properties.containerWidth}, settings.speed).removeClass('open');
                            } else if (settings.tabLocation === 'bottom') {
                                obj.animate({bottom: '-' + properties.containerHeight}, settings.speed).removeClass('open');
                            }
                       
                        };
                   
                        var slideOut = function() {
                       
                            if (settings.tabLocation == 'top') {
                                obj.animate({top:'-3px'},  settings.speed).addClass('open');
                            } else if (settings.tabLocation == 'left') {
                                obj.animate({left:'-3px'},  settings.speed).addClass('open');
                            } else if (settings.tabLocation == 'right') {
                                obj.animate({right:'-3px'},  settings.speed).addClass('open');
                            } else if (settings.tabLocation == 'bottom') {
                                obj.animate({bottom:'-3px'},  settings.speed).addClass('open');
                            }
                        };
             
                        var clickScreenToClose = function() {
                            obj.click(function(event){
                                event.stopPropagation();
                            });
                       
                            $(document).click(function(){
                                slideIn();
                            });
                        };
                   
                        var clickAction = function(){
                            settings.tabHandle.click(function(event){
                                if (obj.hasClass('open')) {
                                    slideIn();
                                } else {
                                    slideOut();
                                }
                            });
                       
                            clickScreenToClose();
                        };
                   
                        var hoverAction = function(){
                            obj.hover(
                                function(){
                                    slideOut();
                                },
                           
                                function(){
                                    slideIn();
                                });
                           
                                settings.tabHandle.click(function(event){
                                    if (obj.hasClass('open')) {
                                        slideIn();
                                    }
                                });
                                clickScreenToClose();
                           
                        };
                   
                        var slideOutOnLoad = function(){
                            slideIn();
                            setTimeout(slideOut, 500);
                        };
                   
                        //choose which type of action to bind
                        if (settings.action === 'click') {
                            clickAction();
                        }
                   
                        if (settings.action === 'hover') {
                            hoverAction();
                        }
                   
                        if (settings.onLoadSlideOut) {
                            slideOutOnLoad();
                        };
                   
                    };
                })(jQuery);

Et voici ce que j'ai mis dans le template overall_header :

Code:

<!-- Slide chatbox -->
<div class="slide-out-div">
<a class="handle" href="http://link-for-non-js-users.html">Content</a>
<iframe src=http://ssbs.superforum.fr/chatbox/index.forum?page=front  width=700 height=400 frameborder=0 border=0 marginwidth=0 marginheight=0 scrolling=no></iframe>
</div>

Une idée de l'origine du problème ?

Merci de votre attention !

[Walt]

Bonjour,

Pouvez-vous vous rendre dans votre panneau d'administration > Modules > Gestion des codes Javascript, et vérifier si l'option d'activation est sur "OUI".



Cordialement,
Walt

[Yoshkill]

Houla, effectivement, j'ai été étourdi. Mes scripts étaient désactivés, je ne sais plus pourquoi... Merci beaucoup !