Problème avec mes codes JavaScript

[Lixyr]

Re-bonsoir, ForumActif.

Je viens ici poster non parce que j'ai un soucis avec un code, mais avec trois.
Suite à ce topic posté hier, j'ai donc essayé mes codes java un par un. Aucun ne fonctionne. Ce qui est étrange, c'est que quand je les mettais dans une page html, ils fonctionnaient très bien.

Je les ai donc remis chacun dans une page html. C'est ma situation actuelle. Mes codes marchent, donc, là.
J'ai effectué un autre test : j'ai pris le code java du code de mes onglets, et je l'ai mis dans une page java. J'ai supprimé le code dans ma PA, et mes onglets marchent parfaitement bien.

C'est donc évident que la faute viennent de mes codes. Je les ai puisés, pour deux, sur ce forum-ci. Et un autre sur internet.


Je mets donc mes codes à disposition afin que quelqu'un puisse regarder, et me dire les erreurs qu'ils cachent.



1) Le Selecteur de couleur !


Code Java :

Code:

$(document).ready(function(){
if($('#color').length==0) return;
/**
 *
 * Color picker
 * Author: Stefan Petre www.eyecon.ro
 *
 * Dual licensed under the MIT and GPL licenses
 *
 */
(function ($) {
    var ColorPicker = function () {
        var
            ids = {},
            inAction,
            charMin = 65,
            visible,
            tpl = '<div class="colorpicker"><div class="colorpicker_color"><div><div></div></div></div><div class="colorpicker_hue"><div></div></div><div class="colorpicker_new_color"></div><div class="colorpicker_current_color"></div><div class="colorpicker_hex"><input type="text" maxlength="6" size="6" /></div><div class="colorpicker_rgb_r colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_g colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_b colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_h colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_s colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_b colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_submit"></div></div>',
            defaults = {
                eventName: 'click',
                onShow: function () {},
                onBeforeShow: function(){},
                onHide: function () {},
                onChange: function () {},
                onSubmit: function () {},
                color: 'ff0000',
                livePreview: true,
                flat: false
            },
            fillRGBFields = function  (hsb, cal) {
                var rgb = HSBToRGB(hsb);
                $(cal).data('colorpicker').fields
                    .eq(1).val(rgb.r).end()
                    .eq(2).val(rgb.g).end()
                    .eq(3).val(rgb.b).end();
            },
            fillHSBFields = function  (hsb, cal) {
                $(cal).data('colorpicker').fields
                    .eq(4).val(hsb.h).end()
                    .eq(5).val(hsb.s).end()
                    .eq(6).val(hsb.b).end();
            },
            fillHexFields = function (hsb, cal) {
                $(cal).data('colorpicker').fields
                    .eq(0).val(HSBToHex(hsb)).end();
            },
            setSelector = function (hsb, cal) {
                $(cal).data('colorpicker').selector.css('backgroundColor', '#' + HSBToHex({h: hsb.h, s: 100, b: 100}));
                $(cal).data('colorpicker').selectorIndic.css({
                    left: parseInt(150 * hsb.s/100, 10),
                    top: parseInt(150 * (100-hsb.b)/100, 10)
                });
            },
            setHue = function (hsb, cal) {
                $(cal).data('colorpicker').hue.css('top', parseInt(150 - 150 * hsb.h/360, 10));
            },
            setCurrentColor = function (hsb, cal) {
                $(cal).data('colorpicker').currentColor.css('backgroundColor', '#' + HSBToHex(hsb));
            },
            setNewColor = function (hsb, cal) {
                $(cal).data('colorpicker').newColor.css('backgroundColor', '#' + HSBToHex(hsb));
            },
            keyDown = function (ev) {
                var pressedKey = ev.charCode || ev.keyCode || -1;
                if ((pressedKey > charMin && pressedKey <= 90) || pressedKey == 32) {
                    return false;
                }
                var cal = $(this).parent().parent();
                if (cal.data('colorpicker').livePreview === true) {
                    change.apply(this);
                }
            },
            change = function (ev) {
                var cal = $(this).parent().parent(), col;
                if (this.parentNode.className.indexOf('_hex') > 0) {
                    cal.data('colorpicker').color = col = HexToHSB(fixHex(this.value));
                } else if (this.parentNode.className.indexOf('_hsb') > 0) {
                    cal.data('colorpicker').color = col = fixHSB({
                        h: parseInt(cal.data('colorpicker').fields.eq(4).val(), 10),
                        s: parseInt(cal.data('colorpicker').fields.eq(5).val(), 10),
                        b: parseInt(cal.data('colorpicker').fields.eq(6).val(), 10)
                    });
                } else {
                    cal.data('colorpicker').color = col = RGBToHSB(fixRGB({
                        r: parseInt(cal.data('colorpicker').fields.eq(1).val(), 10),
                        g: parseInt(cal.data('colorpicker').fields.eq(2).val(), 10),
                        b: parseInt(cal.data('colorpicker').fields.eq(3).val(), 10)
                    }));
                }
                if (ev) {
                    fillRGBFields(col, cal.get(0));
                    fillHexFields(col, cal.get(0));
                    fillHSBFields(col, cal.get(0));
                }
                setSelector(col, cal.get(0));
                setHue(col, cal.get(0));
                setNewColor(col, cal.get(0));
                cal.data('colorpicker').onChange.apply(cal, [col, HSBToHex(col), HSBToRGB(col)]);
            },
            blur = function (ev) {
                var cal = $(this).parent().parent();
                cal.data('colorpicker').fields.parent().removeClass('colorpicker_focus');
            },
            focus = function () {
                charMin = this.parentNode.className.indexOf('_hex') > 0 ? 70 : 65;
                $(this).parent().parent().data('colorpicker').fields.parent().removeClass('colorpicker_focus');
                $(this).parent().addClass('colorpicker_focus');
            },
            downIncrement = function (ev) {
                var field = $(this).parent().find('input').focus();
                var current = {
                    el: $(this).parent().addClass('colorpicker_slider'),
                    max: this.parentNode.className.indexOf('_hsb_h') > 0 ? 360 : (this.parentNode.className.indexOf('_hsb') > 0 ? 100 : 255),
                    y: ev.pageY,
                    field: field,
                    val: parseInt(field.val(), 10),
                    preview: $(this).parent().parent().data('colorpicker').livePreview                   
                };
                $(document).bind('mouseup', current, upIncrement);
                $(document).bind('mousemove', current, moveIncrement);
            },
            moveIncrement = function (ev) {
                ev.data.field.val(Math.max(0, Math.min(ev.data.max, parseInt(ev.data.val + ev.pageY - ev.data.y, 10))));
                if (ev.data.preview) {
                    change.apply(ev.data.field.get(0), [true]);
                }
                return false;
            },
            upIncrement = function (ev) {
                change.apply(ev.data.field.get(0), [true]);
                ev.data.el.removeClass('colorpicker_slider').find('input').focus();
                $(document).unbind('mouseup', upIncrement);
                $(document).unbind('mousemove', moveIncrement);
                return false;
            },
            downHue = function (ev) {
                var current = {
                    cal: $(this).parent(),
                    y: $(this).offset().top
                };
                current.preview = current.cal.data('colorpicker').livePreview;
                $(document).bind('mouseup', current, upHue);
                $(document).bind('mousemove', current, moveHue);
            },
            moveHue = function (ev) {
                change.apply(
                    ev.data.cal.data('colorpicker')
                        .fields
                        .eq(4)
                        .val(parseInt(360*(150 - Math.max(0,Math.min(150,(ev.pageY - ev.data.y))))/150, 10))
                        .get(0),
                    [ev.data.preview]
                );
                return false;
            },
            upHue = function (ev) {
                fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
                fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
                $(document).unbind('mouseup', upHue);
                $(document).unbind('mousemove', moveHue);
                return false;
            },
            downSelector = function (ev) {
                var current = {
                    cal: $(this).parent(),
                    pos: $(this).offset()
                };
                current.preview = current.cal.data('colorpicker').livePreview;
                $(document).bind('mouseup', current, upSelector);
                $(document).bind('mousemove', current, moveSelector);
            },
            moveSelector = function (ev) {
                change.apply(
                    ev.data.cal.data('colorpicker')
                        .fields
                        .eq(6)
                        .val(parseInt(100*(150 - Math.max(0,Math.min(150,(ev.pageY - ev.data.pos.top))))/150, 10))
                        .end()
                        .eq(5)
                        .val(parseInt(100*(Math.max(0,Math.min(150,(ev.pageX - ev.data.pos.left))))/150, 10))
                        .get(0),
                    [ev.data.preview]
                );
                return false;
            },
            upSelector = function (ev) {
                fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
                fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
                $(document).unbind('mouseup', upSelector);
                $(document).unbind('mousemove', moveSelector);
                return false;
            },
            enterSubmit = function (ev) {
                $(this).addClass('colorpicker_focus');
            },
            leaveSubmit = function (ev) {
                $(this).removeClass('colorpicker_focus');
            },
            clickSubmit = function (ev) {
                var cal = $(this).parent();
                var col = cal.data('colorpicker').color;
                cal.data('colorpicker').origColor = col;
                setCurrentColor(col, cal.get(0));
                cal.data('colorpicker').onSubmit(col, HSBToHex(col), HSBToRGB(col), cal.data('colorpicker').el, ev);
            },
            show = function (ev) {
                var cal = $('#' + $(this).data('colorpickerId'));
                cal.data('colorpicker').onBeforeShow.apply(this, [cal.get(0)]);
                var pos = $(this).offset();
                var viewPort = getViewport();
                var top = pos.top + this.offsetHeight;
                var left = pos.left;
                if (top + 176 > viewPort.t + viewPort.h) {
                    top -= this.offsetHeight + 176;
                }
                if (left + 356 > viewPort.l + viewPort.w) {
                    left -= 356;
                }
                cal.css({left: left + 'px', top: top + 'px'});
                if (cal.data('colorpicker').onShow.apply(this, [cal.get(0)]) != false) {
                    cal.show();
                }
                $(document).bind('mousedown', {cal: cal}, hide);
                return false;
            },
            hide = function (ev) {
                if (!isChildOf(ev.data.cal.get(0), ev.target, ev.data.cal.get(0))) {
                    if (ev.data.cal.data('colorpicker').onHide.apply(this, [ev.data.cal.get(0)]) != false) {
                        ev.data.cal.hide();
                    }
                    $(document).unbind('mousedown', hide);
                }
            },
            isChildOf = function(parentEl, el, container) {
                if (parentEl == el) {
                    return true;
                }
                if (parentEl.contains) {
                    return parentEl.contains(el);
                }
                if ( parentEl.compareDocumentPosition ) {
                    return !!(parentEl.compareDocumentPosition(el) & 16);
                }
                var prEl = el.parentNode;
                while(prEl && prEl != container) {
                    if (prEl == parentEl)
                        return true;
                    prEl = prEl.parentNode;
                }
                return false;
            },
            getViewport = function () {
                var m = document.compatMode == 'CSS1Compat';
                return {
                    l : window.pageXOffset || (m ? document.documentElement.scrollLeft : document.body.scrollLeft),
                    t : window.pageYOffset || (m ? document.documentElement.scrollTop : document.body.scrollTop),
                    w : window.innerWidth || (m ? document.documentElement.clientWidth : document.body.clientWidth),
                    h : window.innerHeight || (m ? document.documentElement.clientHeight : document.body.clientHeight)
                };
            },
            fixHSB = function (hsb) {
                return {
                    h: Math.min(360, Math.max(0, hsb.h)),
                    s: Math.min(100, Math.max(0, hsb.s)),
                    b: Math.min(100, Math.max(0, hsb.b))
                };
            },
            fixRGB = function (rgb) {
                return {
                    r: Math.min(255, Math.max(0, rgb.r)),
                    g: Math.min(255, Math.max(0, rgb.g)),
                    b: Math.min(255, Math.max(0, rgb.b))
                };
            },
            fixHex = function (hex) {
                var len = 6 - hex.length;
                if (len > 0) {
                    var o = [];
                    for (var i=0; i<len; i++) {
                        o.push('0');
                    }
                    o.push(hex);
                    hex = o.join('');
                }
                return hex;
            },
            HexToRGB = function (hex) {
                var hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
                return {r: hex >> 16, g: (hex & 0x00FF00) >> 8, b: (hex & 0x0000FF)};
            },
            HexToHSB = function (hex) {
                return RGBToHSB(HexToRGB(hex));
            },
            RGBToHSB = function (rgb) {
                var hsb = {
                    h: 0,
                    s: 0,
                    b: 0
                };
                var min = Math.min(rgb.r, rgb.g, rgb.b);
                var max = Math.max(rgb.r, rgb.g, rgb.b);
                var delta = max - min;
                hsb.b = max;
                if (max != 0) {
                   
                }
                hsb.s = max != 0 ? 255 * delta / max : 0;
                if (hsb.s != 0) {
                    if (rgb.r == max) {
                        hsb.h = (rgb.g - rgb.b) / delta;
                    } else if (rgb.g == max) {
                        hsb.h = 2 + (rgb.b - rgb.r) / delta;
                    } else {
                        hsb.h = 4 + (rgb.r - rgb.g) / delta;
                    }
                } else {
                    hsb.h = -1;
                }
                hsb.h *= 60;
                if (hsb.h < 0) {
                    hsb.h += 360;
                }
                hsb.s *= 100/255;
                hsb.b *= 100/255;
                return hsb;
            },
            HSBToRGB = function (hsb) {
                var rgb = {};
                var h = Math.round(hsb.h);
                var s = Math.round(hsb.s*255/100);
                var v = Math.round(hsb.b*255/100);
                if(s == 0) {
                    rgb.r = rgb.g = rgb.b = v;
                } else {
                    var t1 = v;
                    var t2 = (255-s)*v/255;
                    var t3 = (t1-t2)*(h%60)/60;
                    if(h==360) h = 0;
                    if(h<60) {rgb.r=t1;    rgb.b=t2; rgb.g=t2+t3}
                    else if(h<120) {rgb.g=t1; rgb.b=t2;    rgb.r=t1-t3}
                    else if(h<180) {rgb.g=t1; rgb.r=t2;    rgb.b=t2+t3}
                    else if(h<240) {rgb.b=t1; rgb.r=t2;    rgb.g=t1-t3}
                    else if(h<300) {rgb.b=t1; rgb.g=t2;    rgb.r=t2+t3}
                    else if(h<360) {rgb.r=t1; rgb.g=t2;    rgb.b=t1-t3}
                    else {rgb.r=0; rgb.g=0;    rgb.b=0}
                }
                return {r:Math.round(rgb.r), g:Math.round(rgb.g), b:Math.round(rgb.b)};
            },
            RGBToHex = function (rgb) {
                var hex = [
                    rgb.r.toString(16),
                    rgb.g.toString(16),
                    rgb.b.toString(16)
                ];
                $.each(hex, function (nr, val) {
                    if (val.length == 1) {
                        hex[nr] = '0' + val;
                    }
                });
                return hex.join('');
            },
            HSBToHex = function (hsb) {
                return RGBToHex(HSBToRGB(hsb));
            },
            restoreOriginal = function () {
                var cal = $(this).parent();
                var col = cal.data('colorpicker').origColor;
                cal.data('colorpicker').color = col;
                fillRGBFields(col, cal.get(0));
                fillHexFields(col, cal.get(0));
                fillHSBFields(col, cal.get(0));
                setSelector(col, cal.get(0));
                setHue(col, cal.get(0));
                setNewColor(col, cal.get(0));
            };
        return {
            init: function (opt) {
                opt = $.extend({}, defaults, opt||{});
                if (typeof opt.color == 'string') {
                    opt.color = HexToHSB(opt.color);
                } else if (opt.color.r != undefined && opt.color.g != undefined && opt.color.b != undefined) {
                    opt.color = RGBToHSB(opt.color);
                } else if (opt.color.h != undefined && opt.color.s != undefined && opt.color.b != undefined) {
                    opt.color = fixHSB(opt.color);
                } else {
                    return this;
                }
                return this.each(function () {
                    if (!$(this).data('colorpickerId')) {
                        var options = $.extend({}, opt);
                        options.origColor = opt.color;
                        var id = 'collorpicker_' + parseInt(Math.random() * 1000);
                        $(this).data('colorpickerId', id);
                        var cal = $(tpl).attr('id', id);
                        if (options.flat) {
                            cal.appendTo(this).show();
                        } else {
                            cal.appendTo(document.body);
                        }
                        options.fields = cal
                                            .find('input')
                                                .bind('keyup', keyDown)
                                                .bind('change', change)
                                                .bind('blur', blur)
                                                .bind('focus', focus);
                        cal
                            .find('span').bind('mousedown', downIncrement).end()
                            .find('>div.colorpicker_current_color').bind('click', restoreOriginal);
                        options.selector = cal.find('div.colorpicker_color').bind('mousedown', downSelector);
                        options.selectorIndic = options.selector.find('div div');
                        options.el = this;
                        options.hue = cal.find('div.colorpicker_hue div');
                        cal.find('div.colorpicker_hue').bind('mousedown', downHue);
                        options.newColor = cal.find('div.colorpicker_new_color');
                        options.currentColor = cal.find('div.colorpicker_current_color');
                        cal.data('colorpicker', options);
                        cal.find('div.colorpicker_submit')
                            .bind('mouseenter', enterSubmit)
                            .bind('mouseleave', leaveSubmit)
                            .bind('click', clickSubmit);
                        fillRGBFields(options.color, cal.get(0));
                        fillHSBFields(options.color, cal.get(0));
                        fillHexFields(options.color, cal.get(0));
                        setHue(options.color, cal.get(0));
                        setSelector(options.color, cal.get(0));
                        setCurrentColor(options.color, cal.get(0));
                        setNewColor(options.color, cal.get(0));
                        if (options.flat) {
                            cal.css({
                                position: 'relative',
                                display: 'block'
                            });
                        } else {
                            $(this).bind(options.eventName, show);
                        }
                    }
                });
            },
            showPicker: function() {
                return this.each( function () {
                    if ($(this).data('colorpickerId')) {
                        show.apply(this);
                    }
                });
            },
            hidePicker: function() {
                return this.each( function () {
                    if ($(this).data('colorpickerId')) {
                        $('#' + $(this).data('colorpickerId')).hide();
                    }
                });
            },
            setColor: function(col) {
                if (typeof col == 'string') {
                    col = HexToHSB(col);
                } else if (col.r != undefined && col.g != undefined && col.b != undefined) {
                    col = RGBToHSB(col);
                } else if (col.h != undefined && col.s != undefined && col.b != undefined) {
                    col = fixHSB(col);
                } else {
                    return this;
                }
                return this.each(function(){
                    if ($(this).data('colorpickerId')) {
                        var cal = $('#' + $(this).data('colorpickerId'));
                        cal.data('colorpicker').color = col;
                        cal.data('colorpicker').origColor = col;
                        fillRGBFields(col, cal.get(0));
                        fillHSBFields(col, cal.get(0));
                        fillHexFields(col, cal.get(0));
                        setHue(col, cal.get(0));
                        setSelector(col, cal.get(0));
                        setCurrentColor(col, cal.get(0));
                        setNewColor(col, cal.get(0));
                    }
                });
            }
        };
    }();
    $.fn.extend({
        ColorPicker: ColorPicker.init,
        ColorPickerHide: ColorPicker.hidePicker,
        ColorPickerShow: ColorPicker.showPicker,
        ColorPickerSetColor: ColorPicker.setColor
    });
})(jQuery)

/**
 *
 * Color picker : added code using the color picker to change the picking color method on forumactif
 *
 */       
$('#wcolor,#color').html('<div></div>');

if(my_getcookie('defaultColor')) defaulColor=my_getcookie('defaultColor');
else defaulColor='000000';
$('#color div').ColorPicker({color: defaulColor, flat: true,onSubmit: function(hsb, hex, rgb, el, ev) { my_setcookie('defaultColor',hex,1,0); bbfontstyle('[color=#'+hex+']','[/color]');selectWysiwyg(el,'color');return false }});
$('#wcolor div').ColorPicker({color: defaulColor, flat: true,onSubmit: function(hsb, hex, rgb, el, ev) { my_setcookie('defaultColor',hex,1,0); vB_Editor['text_editor'].format(ev,'constructBBcode_select_color_#'+hex,false,true); }});
});

et Code CSS :

Code:



.colorpicker {
  width: 356px;
  height: 176px;
  overflow: hidden;
  position: absolute;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_background.png);
  font-family: Arial, Helvetica, sans-serif;
  display: none;}
.colorpicker_color {
  width: 150px;
  height: 150px;
  left: 14px;
  top: 13px;
  position: absolute;
  background: #f00;
  overflow: hidden;
  cursor: crosshair;}
.colorpicker_color div {
  position: absolute;
  top: 0;
  left: 0;
  width: 150px;
  height: 150px;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_overlay.png);}
.colorpicker_color div div {
  position: absolute;
  top: 0;
  left: 0;
  width: 11px;
  height: 11px;
  overflow: hidden;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_select.gif);
  margin: -5px 0 0 -5px;}
.colorpicker_hue {
  position: absolute;
  top: 13px;
  left: 171px;
  width: 35px;
  height: 150px;
  cursor: n-resize;}
.colorpicker_hue div {
  position: absolute;
  width: 35px;
  height: 9px;
  overflow: hidden;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_indic.gif) left top;
  margin: -4px 0 0 0;
  left: 0px;}
.colorpicker_new_color {
  position: absolute;
  width: 60px;
  height: 30px;
  left: 213px;
  top: 13px;
  background: #f00;}
.colorpicker_current_color {
  position: absolute;
  width: 60px;
  height: 30px;
  left: 283px;
  top: 13px;
  background: #f00;}
.colorpicker input {
  background-color: transparent;
  border: 1px solid transparent;
  position: absolute;
  font-size: 10px;
  font-family: Arial, Helvetica, sans-serif;
  color: #898989;
  top: 4px;
  right: 11px;
  text-align: right;
  margin: 0;
  padding: 0;
  height: 11px;}
.colorpicker_hex {
  position: absolute;
  width: 72px;
  height: 22px;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_hex.png) top;
  left: 212px;
  top: 142px;}
.colorpicker_hex input {
  right: 6px;}
.colorpicker_field {
  height: 22px;
  width: 62px;
  background-position: top;
  position: absolute;}
.colorpicker_field span {
  position: absolute;
  width: 12px;
  height: 22px;
  overflow: hidden;
  top: 0;
  right: 0;
  cursor: n-resize;}
.colorpicker_rgb_r {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_r.png);
  top: 52px;
  left: 212px;}
.colorpicker_rgb_g {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_g.png);
  top: 82px;
  left: 212px;}
.colorpicker_rgb_b {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_b.png);
  top: 112px;
  left: 212px;}
.colorpicker_hsb_h {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_h.png);
  top: 52px;
  left: 282px;}
.colorpicker_hsb_s {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_s.png);
  top: 82px;
  left: 282px;}
.colorpicker_hsb_b {
  background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_b.png);
  top: 112px;
  left: 282px;}
.colorpicker_submit {
  position: absolute;
  width: 22px;
  height: 22px;
  background: url(http://tinyurl.com/colorpickerimg/colorpicker_submit.png) top;
  left: 322px;
  top: 142px;
  overflow: hidden;}
.colorpicker_focus {
  background-position: center;}
.colorpicker_hex.colorpicker_focus {
  background-position: bottom;}
.colorpicker_submit.colorpicker_focus {
  background-position: bottom;}
.colorpicker_slider {
  background-position: bottom;}

2) La vérification des Pseudos par couleur à l'inscription :


Code Java :

Code:

$(function(){
    if(window.location.href.match(/register\?agreed=true&step=2/) && $('#username_reg').length)
    {   
        function verifyRU() {
            $('#username_reg').attr('value',$('#username_reg').attr('value').trim().replace(/(\s)\s+/g,'$1'));
            if($('#username_reg').attr('value')=='') $('#username_reg').removeClass('okusername');
            else $.get('/search?mode=searchuser&fieldname=username&search_username='+encodeURIComponent($('#username_reg').attr('value'))+'&time='+Math.floor((new Date()).getTime()/1000),function(data){ ($(data).find('#username_list').length==1 && $(data).find('#username_list option').length==1 && $(data).find('#username_list option').attr('value')!='')?$('#username_reg').removeClass('okusername'):$('#username_reg').addClass('okusername'); });
        }
        $('#username_reg').change(function(){ verifyRU(); });
        if(typeof facebook_register_login == 'function') {
            var old_frl= facebook_register_login;
            facebook_register_login= function () {
                    old_frl(); verifyRU();
            };
        }
        verifyRU();
    }
});

et code CSS :

Code:

/* Début - style pour vérification pseudo à l'inscription */
#username_reg {
  color: #112E2B;
}
#username_reg.okusername {
  color: #a90c0c;
}
/* Fin - style pour vérification pseudo à l'inscription */

Et enfin 3) L'opacité progressive :

Code Java :

Code:

//Gradual Elements Fader- By Dynamic Drive at http://www.dynamicdrive.com
//Last updated: Nov 8th, 07'

var gradualFader={}

gradualFader.baseopacity=0.4 //set base opacity when mouse isn't over element (decimal below 1)
gradualFader.increment=0.1 //amount of opacity to increase after each iteration (suggestion: 0.1 or 0.2)

document.write('<style type="text/css">\n') //write out CSS to enable opacity on "gradualfader" class
document.write('.gradualfader{filter:progid:DXImageTransform.Microsoft.alpha(opacity='+gradualFader.baseopacity*100+'); -moz-opacity:'+gradualFader.baseopacity+'; opacity:'+gradualFader.baseopacity+';}\n')
document.write('</style>')

gradualFader.setopacity=function(obj, value){ //Sets the opacity of targetobject based on the passed in value setting (0 to 1 and in between)
   var targetobject=obj
   if (targetobject && targetobject.filters && targetobject.filters[0]){ //IE syntax
      if (typeof targetobject.filters[0].opacity=="number") //IE6
         targetobject.filters[0].opacity=value*100
      else //IE 5.5
         targetobject.style.filter="alpha(opacity="+value*100+")"
      }
   else if (targetobject && typeof targetobject.style.MozOpacity!="undefined") //Old Mozilla syntax
      targetobject.style.MozOpacity=value
   else if (targetobject && typeof targetobject.style.opacity!="undefined") //Standard opacity syntax
      targetobject.style.opacity=value
   targetobject.currentopacity=value
}

gradualFader.fadeupdown=function(obj, direction){
   var targetobject=obj
   var fadeamount=(direction=="fadeup")? this.increment : -this.increment
   if (targetobject && (direction=="fadeup" && targetobject.currentopacity<1 || direction=="fadedown" && targetobject.currentopacity>this.baseopacity)){
      this.setopacity(obj, targetobject.currentopacity+fadeamount)
      window["opacityfader"+obj._fadeorder]=setTimeout(function(){gradualFader.fadeupdown(obj, direction)}, 50)
   }
}

gradualFader.clearTimer=function(obj){
if (typeof window["opacityfader"+obj._fadeorder]!="undefined")
   clearTimeout(window["opacityfader"+obj._fadeorder])
}

gradualFader.isContained=function(m, e){
   var e=window.event || e
   var c=e.relatedTarget || ((e.type=="mouseover")? e.fromElement : e.toElement)
   while (c && c!=m)try {c=c.parentNode} catch(e){c=m}
   if (c==m)
      return true
   else
      return false
}

gradualFader.fadeinterface=function(obj, e, direction){
   if (!this.isContained(obj, e)){
      gradualFader.clearTimer(obj)
      gradualFader.fadeupdown(obj, direction)
   }
}

gradualFader.collectElementbyClass=function(classname){ //Returns an array containing DIVs with specified classname
   var classnameRE=new RegExp("(^|\\s+)"+classname+"($|\\s+)", "i") //regular expression to screen for classname within element
   var pieces=[]
   var alltags=document.all? document.all : document.getElementsByTagName("*")
   for (var i=0; i<alltags.length; i++){
      if (typeof alltags[i].className=="string" && alltags[i].className.search(classnameRE)!=-1)
         pieces[pieces.length]=alltags[i]
   }
   return pieces
}

gradualFader.init=function(){
   var targetobjects=this.collectElementbyClass("gradualfader")
   for (var i=0; i<targetobjects.length; i++){
      targetobjects[i]._fadeorder=i
      this.setopacity(targetobjects[i], this.baseopacity)
      targetobjects[i].onmouseover=function(e){gradualFader.fadeinterface(this, e, "fadeup")}
      targetobjects[i].onmouseout=function(e){gradualFader.fadeinterface(this, e, "fadedown")}
   }
}

Voilà.

Mes codes ont respectivement été trouvés ici :

- selecteur de couleur
- pseudo utilisé ou pas à l'inscription
- image opaque progressive


Voilà.
Bonne chance à ceux ou celles qui s'attèleront à la tâche ... .
Bonne soirée à vous.

[Lixyr]

Up.

[Lixyr]

Up.

[bando]

Bonjour,

Attention c'est du javascript pas du Java sinon avez-vous des erreurs Javascript ?
Ils étaient dans le module "gestion des javascript" ?

[Lixyr]

Bonjour Dauclem.

Désolée, je sais bien la différence entre le Java et le Javascript. C'est juste que ça sonnait comme un raccourcit...


Et bien, mes codes marchaient très bien quand je les ai mis dans les pages html, et que je les ai attribués à toutes les pages via la description du forum. Seulement, en les mettant dans la gestion des pages javascript, sur toutes les pages, ils ne marchent plus.

Vous m'aviez dit ultérieurement que j'avais surement des erreurs de script. Mais je n'en sais pas plus.

Actuellement, mes codes sont remis dans les pages html, puisqu'ils fonctionnent quand je les y mets. (et le forum en question).

J'ai bien suivi le tuto proposé : modification du template etc, et rien ne fonctionne.
J'ai surement oublié de faire quelque chose... . Ça ne m'étonnerait pas.

Mais je ne saurais en dire plus.

Cordialement.

[Lixyr]

up.

[Ea]

Bonjour,


Pour le sélecteur de couleur ça a été modifié dans le tutoriel il me semble, en le passant dans le closure compiler ça donne :

Code:

$(document).ready(function() {
  $("#color").length != 0 && (function(c) {
    var e = function() {
      var e = 65, j = {eventName:"click", onShow:function() {
      }, onBeforeShow:function() {
      }, onHide:function() {
      }, onChange:function() {
      }, onSubmit:function() {
      }, color:"ff0000", livePreview:!0, flat:!1}, i = function(a, b) {
        var d = h(a);
        c(b).data("colorpicker").fields.eq(1).val(d.r).end().eq(2).val(d.g).end().eq(3).val(d.b).end()
      }, n = function(a, b) {
        c(b).data("colorpicker").fields.eq(4).val(a.h).end().eq(5).val(a.s).end().eq(6).val(a.b).end()
      }, l = function(a, b) {
        c(b).data("colorpicker").fields.eq(0).val(k(h(a))).end()
      }, o = function(a, b) {
        c(b).data("colorpicker").selector.css("backgroundColor", "#" + k(h({h:a.h, s:100, b:100})));
        c(b).data("colorpicker").selectorIndic.css({left:parseInt(150 * a.s / 100, 10), top:parseInt(150 * (100 - a.b) / 100, 10)})
      }, p = function(a, b) {
        c(b).data("colorpicker").hue.css("top", parseInt(150 - 150 * a.h / 360, 10))
      }, r = function(a, b) {
        c(b).data("colorpicker").currentColor.css("backgroundColor", "#" + k(h(a)))
      }, q = function(a, b) {
        c(b).data("colorpicker").newColor.css("backgroundColor", "#" + k(h(a)))
      }, D = function(a) {
        a = a.charCode || a.keyCode || -1;
        if(a > e && a <= 90 || a == 32) {
          return!1
        }
        c(this).parent().parent().data("colorpicker").livePreview === !0 && g.apply(this)
      }, g = function(a) {
        var b = c(this).parent().parent(), d;
        if(this.parentNode.className.indexOf("_hex") > 0) {
          d = b.data("colorpicker");
          var f = this.value, e = 6 - f.length;
          if(e > 0) {
            for(var g = [], j = 0;j < e;j++) {
              g.push("0")
            }
            g.push(f);
            f = g.join("")
          }
          f = m(s(f));
          d.color = d = f
        }else {
          this.parentNode.className.indexOf("_hsb") > 0 ? b.data("colorpicker").color = d = t({h:parseInt(b.data("colorpicker").fields.eq(4).val(), 10), s:parseInt(b.data("colorpicker").fields.eq(5).val(), 10), b:parseInt(b.data("colorpicker").fields.eq(6).val(), 10)}) : (d = b.data("colorpicker"), f = {r:parseInt(b.data("colorpicker").fields.eq(1).val(), 10), g:parseInt(b.data("colorpicker").fields.eq(2).val(), 10), b:parseInt(b.data("colorpicker").fields.eq(3).val(), 10)}, d.color = d = m({r:Math.min(255,
          Math.max(0, f.r)), g:Math.min(255, Math.max(0, f.g)), b:Math.min(255, Math.max(0, f.b))}))
        }
        a && (i(d, b.get(0)), l(d, b.get(0)), n(d, b.get(0)));
        o(d, b.get(0));
        p(d, b.get(0));
        q(d, b.get(0));
        b.data("colorpicker").onChange.apply(b, [d, k(h(d)), h(d)])
      }, E = function() {
        c(this).parent().parent().data("colorpicker").fields.parent().removeClass("colorpicker_focus")
      }, F = function() {
        e = this.parentNode.className.indexOf("_hex") > 0 ? 70 : 65;
        c(this).parent().parent().data("colorpicker").fields.parent().removeClass("colorpicker_focus");
        c(this).parent().addClass("colorpicker_focus")
      }, G = function(a) {
        var b = c(this).parent().find("input").focus(), a = {el:c(this).parent().addClass("colorpicker_slider"), max:this.parentNode.className.indexOf("_hsb_h") > 0 ? 360 : this.parentNode.className.indexOf("_hsb") > 0 ? 100 : 255, y:a.pageY, field:b, val:parseInt(b.val(), 10), preview:c(this).parent().parent().data("colorpicker").livePreview};
        c(document).bind("mouseup", a, u);
        c(document).bind("mousemove", a, v)
      }, v = function(a) {
        a.data.field.val(Math.max(0, Math.min(a.data.max, parseInt(a.data.val + a.pageY - a.data.y, 10))));
        a.data.preview && g.apply(a.data.field.get(0), [!0]);
        return!1
      }, u = function(a) {
        g.apply(a.data.field.get(0), [!0]);
        a.data.el.removeClass("colorpicker_slider").find("input").focus();
        c(document).unbind("mouseup", u);
        c(document).unbind("mousemove", v);
        return!1
      }, H = function() {
        var a = {cal:c(this).parent(), y:c(this).offset().top};
        a.preview = a.cal.data("colorpicker").livePreview;
        c(document).bind("mouseup", a, w);
        c(document).bind("mousemove", a, x)
      }, x = function(a) {
        g.apply(a.data.cal.data("colorpicker").fields.eq(4).val(parseInt(360 * (150 - Math.max(0, Math.min(150, a.pageY - a.data.y))) / 150, 10)).get(0), [a.data.preview]);
        return!1
      }, w = function(a) {
        i(a.data.cal.data("colorpicker").color, a.data.cal.get(0));
        l(a.data.cal.data("colorpicker").color, a.data.cal.get(0));
        c(document).unbind("mouseup", w);
        c(document).unbind("mousemove", x);
        return!1
      }, I = function() {
        var a = {cal:c(this).parent(), pos:c(this).offset()};
        a.preview = a.cal.data("colorpicker").livePreview;
        c(document).bind("mouseup", a, y);
        c(document).bind("mousemove", a, z)
      }, z = function(a) {
        g.apply(a.data.cal.data("colorpicker").fields.eq(6).val(parseInt(100 * (150 - Math.max(0, Math.min(150, a.pageY - a.data.pos.top))) / 150, 10)).end().eq(5).val(parseInt(100 * Math.max(0, Math.min(150, a.pageX - a.data.pos.left)) / 150, 10)).get(0), [a.data.preview]);
        return!1
      }, y = function(a) {
        i(a.data.cal.data("colorpicker").color, a.data.cal.get(0));
        l(a.data.cal.data("colorpicker").color, a.data.cal.get(0));
        c(document).unbind("mouseup", y);
        c(document).unbind("mousemove", z);
        return!1
      }, J = function() {
        c(this).addClass("colorpicker_focus")
      }, K = function() {
        c(this).removeClass("colorpicker_focus")
      }, L = function(a) {
        var b = c(this).parent(), d = b.data("colorpicker").color;
        b.data("colorpicker").origColor = d;
        r(d, b.get(0));
        b.data("colorpicker").onSubmit(d, k(h(d)), h(d), b.data("colorpicker").el, a)
      }, B = function() {
        var a = c("#" + c(this).data("colorpickerId"));
        a.data("colorpicker").onBeforeShow.apply(this, [a.get(0)]);
        var b = c(this).offset(), d;
        d = document.compatMode == "CSS1Compat";
        d = {l:window.pageXOffset || (d ? document.documentElement.scrollLeft : document.body.scrollLeft), t:window.pageYOffset || (d ? document.documentElement.scrollTop : document.body.scrollTop), w:window.innerWidth || (d ? document.documentElement.clientWidth : document.body.clientWidth), h:window.innerHeight || (d ? document.documentElement.clientHeight : document.body.clientHeight)};
        var f = b.top + this.offsetHeight, b = b.left;
        f + 176 > d.t + d.h && (f -= this.offsetHeight + 176);
        b + 356 > d.l + d.w && (b -= 356);
        a.css({left:b + "px", top:f + "px"});
        a.data("colorpicker").onShow.apply(this, [a.get(0)]) != !1 && a.show();
        c(document).bind("mousedown", {cal:a}, A);
        return!1
      }, A = function(a) {
        M(a.data.cal.get(0), a.target, a.data.cal.get(0)) || (a.data.cal.data("colorpicker").onHide.apply(this, [a.data.cal.get(0)]) != !1 && a.data.cal.hide(), c(document).unbind("mousedown", A))
      }, M = function(a, b, d) {
        if(a == b) {
          return!0
        }
        if(a.contains) {
          return a.contains(b)
        }
        if(a.compareDocumentPosition) {
          return!!(a.compareDocumentPosition(b) & 16)
        }
        for(b = b.parentNode;b && b != d;) {
          if(b == a) {
            return!0
          }
          b = b.parentNode
        }
        return!1
      }, t = function(a) {
        return{h:Math.min(360, Math.max(0, a.h)), s:Math.min(100, Math.max(0, a.s)), b:Math.min(100, Math.max(0, a.b))}
      }, s = function(a) {
        a = parseInt(a.indexOf("#") > -1 ? a.substring(1) : a, 16);
        return{r:a >> 16, g:(a & 65280) >> 8, b:a & 255}
      }, m = function(a) {
        var b = {h:0, s:0, b:0}, d = Math.max(a.r, a.g, a.b), c = d - Math.min(a.r, a.g, a.b);
        b.b = d;
        b.s = d != 0 ? 255 * c / d : 0;
        b.h = b.s != 0 ? a.r == d ? (a.g - a.b) / c : a.g == d ? 2 + (a.b - a.r) / c : 4 + (a.r - a.g) / c : -1;
        b.h *= 60;
        b.h < 0 && (b.h += 360);
        b.s *= 100 / 255;
        b.b *= 100 / 255;
        return b
      }, h = function(a) {
        var b = {}, d = Math.round(a.h), c = Math.round(a.s * 255 / 100), a = Math.round(a.b * 255 / 100);
        if(c == 0) {
          b.r = b.g = b.b = a
        }else {
          var c = (255 - c) * a / 255, e = (a - c) * (d % 60) / 60;
          d == 360 && (d = 0);
          d < 60 ? (b.r = a, b.b = c, b.g = c + e) : d < 120 ? (b.g = a, b.b = c, b.r = a - e) : d < 180 ? (b.g = a, b.r = c, b.b = c + e) : d < 240 ? (b.b = a, b.r = c, b.g = a - e) : d < 300 ? (b.b = a, b.g = c, b.r = c + e) : d < 360 ? (b.r = a, b.g = c, b.b = a - e) : (b.r = 0, b.g = 0, b.b = 0)
        }
        return{r:Math.round(b.r), g:Math.round(b.g), b:Math.round(b.b)}
      }, k = function(a) {
        var b = [a.r.toString(16), a.g.toString(16), a.b.toString(16)];
        c.each(b, function(a, c) {
          c.length == 1 && (b[a] = "0" + c)
        });
        return b.join("")
      }, N = function() {
        var a = c(this).parent(), b = a.data("colorpicker").origColor;
        a.data("colorpicker").color = b;
        i(b, a.get(0));
        l(b, a.get(0));
        n(b, a.get(0));
        o(b, a.get(0));
        p(b, a.get(0));
        q(b, a.get(0))
      };
      return{init:function(a) {
        a = c.extend({}, j, a || {});
        if(typeof a.color == "string") {
          a.color = m(s(a.color))
        }else {
          if(a.color.r != void 0 && a.color.g != void 0 && a.color.b != void 0) {
            a.color = m(a.color)
          }else {
            if(a.color.h != void 0 && a.color.s != void 0 && a.color.b != void 0) {
              a.color = t(a.color)
            }else {
              return this
            }
          }
        }
        return this.each(function() {
          if(!c(this).data("colorpickerId")) {
            var b = c.extend({}, a);
            b.origColor = a.color;
            var d = "collorpicker_" + parseInt(Math.random() * 1E3);
            c(this).data("colorpickerId", d);
            d = c('<div class="colorpicker"><div class="colorpicker_color"><div><div></div></div></div><div class="colorpicker_hue"><div></div></div><div class="colorpicker_new_color"></div><div class="colorpicker_current_color"></div><div class="colorpicker_hex"><input type="text" maxlength="6" size="6" /></div><div class="colorpicker_rgb_r colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_g colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_b colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_h colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_s colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_b colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_submit"></div></div>').attr("id",
            d);
            b.flat ? d.appendTo(this).show() : d.appendTo(document.body);
            b.fields = d.find("input").bind("keyup", D).bind("change", g).bind("blur", E).bind("focus", F);
            d.find("span").bind("mousedown", G).end().find(">div.colorpicker_current_color").bind("click", N);
            b.selector = d.find("div.colorpicker_color").bind("mousedown", I);
            b.selectorIndic = b.selector.find("div div");
            b.el = this;
            b.hue = d.find("div.colorpicker_hue div");
            d.find("div.colorpicker_hue").bind("mousedown", H);
            b.newColor = d.find("div.colorpicker_new_color");
            b.currentColor = d.find("div.colorpicker_current_color");
            d.data("colorpicker", b);
            d.find("div.colorpicker_submit").bind("mouseenter", J).bind("mouseleave", K).bind("click", L);
            i(b.color, d.get(0));
            n(b.color, d.get(0));
            l(b.color, d.get(0));
            p(b.color, d.get(0));
            o(b.color, d.get(0));
            r(b.color, d.get(0));
            q(b.color, d.get(0));
            b.flat ? d.css({position:"relative", display:"block"}) : c(this).bind(b.eventName, B)
          }
        })
      }, showPicker:function() {
        return this.each(function() {
          c(this).data("colorpickerId") && B.apply(this)
        })
      }, hidePicker:function() {
        return this.each(function() {
          c(this).data("colorpickerId") && c("#" + c(this).data("colorpickerId")).hide()
        })
      }, setColor:function(a) {
        if(typeof a == "string") {
          a = m(s(a))
        }else {
          if(a.r != void 0 && a.g != void 0 && a.b != void 0) {
            a = m(a)
          }else {
            if(a.h != void 0 && a.s != void 0 && a.b != void 0) {
              a = t(a)
            }else {
              return this
            }
          }
        }
        return this.each(function() {
          if(c(this).data("colorpickerId")) {
            var b = c("#" + c(this).data("colorpickerId"));
            b.data("colorpicker").color = a;
            b.data("colorpicker").origColor = a;
            i(a, b.get(0));
            n(a, b.get(0));
            l(a, b.get(0));
            p(a, b.get(0));
            o(a, b.get(0));
            r(a, b.get(0));
            q(a, b.get(0))
          }
        })
      }}
    }();
    c.fn.extend({ColorPicker:e.init, ColorPickerHide:e.hidePicker, ColorPickerShow:e.showPicker, ColorPickerSetColor:e.setColor})
  }(jQuery), $("#wcolor,#color").html("<div></div>"), defaulColor = my_getcookie("defaultColor") ? my_getcookie("defaultColor") : "000000", $("#color div").ColorPicker({color:defaulColor, flat:!0, onSubmit:function(c, e, C, j) {
    my_setcookie("defaultColor", e, 1, 0);
    bbfontstyle("[color=#" + e + "]", "[/color]");
    selectWysiwyg(j, "color");
    return!1
  }}), $("#wcolor div").ColorPicker({color:defaulColor, flat:!0, onSubmit:function(c, e, C, j, i) {
    my_setcookie("defaultColor", e, 1, 0);
    vB_Editor.text_editor.format(i, "constructBBcode_select_color_#" + e, !1, !0)
  }}))
});

La vérification du pseudo à l'inscription je ne sais pas si ça avait été corrigé, mais en le passant dans le closure compiler ça donne :

Code:

$(function() {
  if(window.location.href.match(/register\?agreed=true&step=2/) && $("#username_reg").length) {
    var a = function() {
      $("#username_reg").attr("value", $("#username_reg").attr("value").trim().replace(/(\s)\s+/g, "$1"));
      $("#username_reg").attr("value") == "" ? $("#username_reg").removeClass("okusername") : $.get("/search?mode=searchuser&fieldname=username&search_username=" + encodeURIComponent($("#username_reg").attr("value")) + "&time=" + Math.floor((new Date).getTime() / 1E3), function(a) {
        $(a).find("#username_list").length == 1 && $(a).find("#username_list option").length == 1 && $(a).find("#username_list option").attr("value") != "" ? $("#username_reg").removeClass("okusername") : $("#username_reg").addClass("okusername")
      })
    };
    $("#username_reg").change(function() {
      a()
    });
    if(typeof facebook_register_login == "function") {
      var b = facebook_register_login;
      facebook_register_login = function() {
        b();
        a()
      }
    }
    a()
  }
});

Pour le gradual fader ça semble donner :

Code:

var gradualFader = {baseopacity:0.4, increment:0.1};
document.write('<style type="text/css">\n');
document.write(".gradualfader{filter:progid:DXImageTransform.Microsoft.alpha(opacity=" + gradualFader.baseopacity * 100 + "); -moz-opacity:" + gradualFader.baseopacity + "; opacity:" + gradualFader.baseopacity + ";}\n");
document.write("</style>");
gradualFader.setopacity = function(a, b) {
  if(a && a.filters && a.filters[0]) {
    typeof a.filters[0].opacity == "number" ? a.filters[0].opacity = b * 100 : a.style.filter = "alpha(opacity=" + b * 100 + ")"
  }else {
    if(a && typeof a.style.MozOpacity != "undefined") {
      a.style.MozOpacity = b
    }else {
      if(a && typeof a.style.opacity != "undefined") {
        a.style.opacity = b
      }
    }
  }
  a.currentopacity = b
};
gradualFader.fadeupdown = function(a, b) {
  var c = b == "fadeup" ? this.increment : -this.increment;
  if(a && (b == "fadeup" && a.currentopacity < 1 || b == "fadedown" && a.currentopacity > this.baseopacity)) {
    this.setopacity(a, a.currentopacity + c), window["opacityfader" + a._fadeorder] = setTimeout(function() {
      gradualFader.fadeupdown(a, b)
    }, 50)
  }
};
gradualFader.clearTimer = function(a) {
  typeof window["opacityfader" + a._fadeorder] != "undefined" && clearTimeout(window["opacityfader" + a._fadeorder])
};
gradualFader.isContained = function(a, b) {
  for(var b = window.event || b, c = b.relatedTarget || (b.type == "mouseover" ? b.fromElement : b.toElement);c && c != a;) {
    try {
      c = c.parentNode
    }catch(d) {
      c = a
    }
  }
  return c == a ? !0 : !1
};
gradualFader.fadeinterface = function(a, b, c) {
  this.isContained(a, b) || (gradualFader.clearTimer(a), gradualFader.fadeupdown(a, c))
};
gradualFader.collectElementbyClass = function(a) {
  for(var a = RegExp("(^|\\s+)" + a + "($|\\s+)", "i"), b = [], c = document.all ? document.all : document.getElementsByTagName("*"), d = 0;d < c.length;d++) {
    typeof c[d].className == "string" && c[d].className.search(a) != -1 && (b[b.length] = c[d])
  }
  return b
};
gradualFader.init = function() {
  for(var a = this.collectElementbyClass("gradualfader"), b = 0;b < a.length;b++) {
    a[b]._fadeorder = b, this.setopacity(a[b], this.baseopacity), a[b].onmouseover = function(a) {
      gradualFader.fadeinterface(this, a, "fadeup")
    }, a[b].onmouseout = function(a) {
      gradualFader.fadeinterface(this, a, "fadedown")
    }
  }
};

Sinon le raccourcis de javascript c'est JS =P

Cordialement.

[Lixyr]

Ah vui, JS ... u_u" là je suis blasée de moi-même.


Etana ... tu es géniale ! Dommage qu'il n'y ait pas le petit smiley qui traduirait cette émotion : *.* - yeux du Chat Potté.

Par contre, donc, j'ai juste un petit problème : la couleur fonctionne quand le pseudo est pris, mais quand il n'est pas pris, il vire quand même au rouge.
Est-ce qu'il y a également une modification dans le css à faire ?

J'avais ça, moi :

Code:

/* Début - style pour vérification pseudo à l'inscription */
#username_reg {
  color: #112E2B;
}
#username_reg.okusername {
  color: #a90c0c;
}
/* Fin - style pour vérification pseudo à l'inscription */

Merci pour le reste.
Cordialement.

[Ea]

C'est bizarre, l'astuce utilise cette fonction qui permet de rechercher un nom d'utilisateur :
https://forum.forumactif.com/search?mode=searchuser&fieldname=username&search_username=test&time=1311112439

Mais sur votre forum http://horirozari.rpgdynasty.com/ en étant déconnecté la page n’apparaît pas et on arrive sur une page de connexion : http://horirozari.rpgdynasty.com/search?mode=searchuser&fieldname=username&search_username=test&time=1311112439

C'est peut-être en relation avec la permission pour voir le profil ou autre chose

Enfin donc sans ça le script doit avoir à chaque fois une page d'erreur et en conclure que tout les pseudos sont "pris".

Cordialement.

[Lixyr]

Je viens de modifier la permission spéciale : voir le profil, et je l'ai permise aux invités. Ça ne change rien.

(dois-je préciser que ça ne marche pas non plus, même en page html ?)

[Ea]

En fait il faut juste la permission pour faire une recherche aux invités on dirait.

Cordialement.

[Lixyr]

J'ai rajouté toutes les permissions possibles via les permissions spéciales aux invités, et ça ne fonctionne toujours pas : le pseudo non utilisé apparait en rouge.


*edit*

Alors j'ai essayé en faisant autrement : j'ai inversé les couleurs dans mon css, et j'ai mis une couleur verte plus probante pour bien voir la différence.

J'ai donc testé sous plusieurs formes, et donc au final, il s'avère que le problème venait :
de la permission des invités sur l'option rechercher.
et du fait qu'apparemment mes couleurs étaient inversées. Donc voilà, j'ai remis tout ça correctement, et maintenant, tout marche.

Mes codes marchent donc tous bien dans la gestion des codes javascript.

Merci beaucoup Etana.