Background panneau coulissant

[nerull]

Bonjours

j'ai un panneau coulissant et je ne sais pas pourquoi ma couleur de fond a disparue comme par enchantement
et je ne parviens pas à trouver l'erreur

1er code

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: '80px',                        //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: 500,
                        action: 'click',
                        tabLocation: 'left',
                        topPos: '100px',
                        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 = 'fixed';
                    }
               
                    //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,
                            'top' : settings.topPos
                        });
                   
                        settings.tabHandle.css({'top' : 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);

2e code

Code:

$(function(){
                        $('.slide-out-div').tabSlideOut({
                            tabHandle: '.handle',                    //class of the element that will become your tab
                            pathToTabImage: 'http://i75.servimg.com/u/f75/18/10/64/94/nav-ra10.png', //path to the image for the tab //Optionally can be set using css
                            imageHeight: '200px',                    //height of tab image          //Optionally can be set using css
                            imageWidth: '40px',                      //width of tab image            //Optionally can be set using css
                            tabLocation: 'left',                      //side of screen where tab lives, top, right, bottom, or left
                            speed: 500,                              //speed of animation
                            action: 'click',                          //options: 'click' or 'hover', action to trigger animation
                            topPos: '60px',                          //position from the top/ use if tabLocation is left or right
                            rightPos: '20px',                          //position from left/ use if tabLocation is bottom or top
                            fixedPosition: false                      //options: true makes it stick(fixed position) on scroll
                        });
             
                    });

et j'ai mis cela dedans via overall_header

Code:

<div class="slide-out-div">
                            <a class="handle" href="http://link-for-non-js-users.html"></a>
                            <h3>Navigation rapide</h3>
                            <p><select style="width: 150px;" onchange="location = this.value">
          <option selected="selected">Navigation rapide</option>
          <option value="http://mygale.forumactif.fr/">Forum</option>
          <option value="http://mygale.forumactif.fr/c2-reglement">Réglement</option>
          <option value="http://mygale.forumactif.fr/c3-forum-hors-mygales">Forum hors mygales</option>
          <option value="http://mygale.forumactif.fr/c5-nos-mygales">Nos mygales</option>
          <option value="http://mygale.forumactif.fr/c7-les-experts">Les experts</option>
          <option value="http://mygale.forumactif.fr/c6-nos-autres-animaux">Nos autres animaux</option>
          <option value="http://mygale.forumactif.fr/c8-petite-annonces">Petite annonces</option>
          <option value="http://mygale.forumactif.fr/privmsg?folder=inbox">MP</option>
          </select></p></div>

[Adam_sfp]

Bonsoir

La couleur de fond n'est pas via votre css ?
Cordialement.

[nerull]

désolé j'ai oublier e vous mettre ce que j'ai dans le css

le voila mais c'est tout ce que j'ai

Code:

settings.tabHandle {
Background-color: #79b165 !important;
height: 30px;
width: 510px !important;
}

[Adam_sfp]

Bonsoir


Essayez de mettre

Code:


.slide-out-div {
    background:#79b165;
    height: 100px;
    z-index: 99999;
 
}

[nerull]

génial merci

mais ce n'est pas normal que je ne trouve pas de moi même et ce n'est pas faute de chercher lol