Extrem Tutorials
Doriți să reacționați la acest mesaj? Creați un cont în câteva clickuri sau conectați-vă pentru a continua.

Extrem TutorialsConectare

Peste 500 tutoriale in limba romana.


descriptionCerere Script EmptyCerere Script

more_horiz
Buna Ziua Extreme Tutorials.
As dori daca se poate sami dati si mie Tipsy Tooltip.
Adica ce sa bag in javascript in css si ce mai trebuie.

Daca se poate sa mil dati pe al dumneavoastra.

descriptionCerere Script EmptyRe: Cerere script

more_horiz
1.Adauga asta in P.A>Module>Gestiunea codurilor javascript> Creeaza un nou javascript > Vizibiltiate toate paginiile

Cod:

// tipsy, facebook style tooltips for jquery
            // version 1.0.0a
            // (c) 2008-2010 jason frame [jason@onehackoranother.com]
            // releated under the MIT license
            (function($) {

            function fixTitle($ele) {
            if ($ele.attr('title') || typeof($ele.attr('original-title')) != 'string') {
            $ele.attr('original-title', $ele.attr('title') || '').removeAttr('title');
            }
            }

            function Tipsy(element, options) {
            this.$element = $(element);
            this.options = options;
            this.enabled = true;
            fixTitle(this.$element);
            }

            Tipsy.prototype = {
            show: function() {
            var title = this.getTitle();
            if (title && this.enabled) {
            var $tip = this.tip();

            $tip.find('.tipsy-inner')[this.options.html ? 'html' : 'text'](title);
            $tip[0].className = 'tipsy'; // reset classname in case of dynamic gravity
            $tip.remove().css({top: 0, left: 0, visibility: 'hidden', display: 'block'}).appendTo(document.body);

            var pos = $.extend({}, this.$element.offset(), {
            width: this.$element[0].offsetWidth,
            height: this.$element[0].offsetHeight
            });

            var actualWidth = $tip[0].offsetWidth, actualHeight = $tip[0].offsetHeight;
            var gravity = (typeof this.options.gravity == 'function')
            ? this.options.gravity.call(this.$element[0])
            : this.options.gravity;

            var tp;
            switch (gravity.charAt(0)) {
            case 'n':
            tp = {top: pos.top + pos.height + this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
            break;
            case 's':
            tp = {top: pos.top - actualHeight - this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
            break;
            case 'e':
            tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth - this.options.offset};
            break;
            case 'w':
            tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width + this.options.offset};
            break;
            }

            if (gravity.length == 2) {
            if (gravity.charAt(1) == 'w') {
            tp.left = pos.left + pos.width / 2 - 15;
            } else {
            tp.left = pos.left + pos.width / 2 - actualWidth + 15;
            }
            }

            $tip.css(tp).addClass('tipsy-' + gravity);

            if (this.options.fade) {
            $tip.stop().css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: this.options.opacity});
            } else {
            $tip.css({visibility: 'visible', opacity: this.options.opacity});
            }
            }
            },

            hide: function() {
            if (this.options.fade) {
            this.tip().stop().fadeOut(function() { $(this).remove(); });
            } else {
            this.tip().remove();
            }
            },

            getTitle: function() {
            var title, $e = this.$element, o = this.options;
            fixTitle($e);
            var title, o = this.options;
            if (typeof o.title == 'string') {
            title = $e.attr(o.title == 'title' ? 'original-title' : o.title);
            } else if (typeof o.title == 'function') {
            title = o.title.call($e[0]);
            }
            title = ('' + title).replace(/(^\s*|\s*$)/, "");
            return title || o.fallback;
            },

            tip: function() {
            if (!this.$tip) {
            this.$tip = $('<div class="tipsy"></div>').html('<div class="tipsy-arrow"></div><div class="tipsy-inner"/></div>');
            }
            return this.$tip;
            },

            validate: function() {
            if (!this.$element[0].parentNode) {
            this.hide();
            this.$element = null;
            this.options = null;
            }
            },

            enable: function() { this.enabled = true; },
            disable: function() { this.enabled = false; },
            toggleEnabled: function() { this.enabled = !this.enabled; }
            };

            $.fn.tipsy = function(options) {

            if (options === true) {
            return this.data('tipsy');
            } else if (typeof options == 'string') {
            return this.data('tipsy')[options]();
            }

            options = $.extend({}, $.fn.tipsy.defaults, options);

            function get(ele) {
            var tipsy = $.data(ele, 'tipsy');
            if (!tipsy) {
            tipsy = new Tipsy(ele, $.fn.tipsy.elementOptions(ele, options));
            $.data(ele, 'tipsy', tipsy);
            }
            return tipsy;
            }

            function enter() {
            var tipsy = get(this);
            tipsy.hoverState = 'in';
            if (options.delayIn == 0) {
            tipsy.show();
            } else {
            setTimeout(function() { if (tipsy.hoverState == 'in') tipsy.show(); }, options.delayIn);
            }
            };

            function leave() {
            var tipsy = get(this);
            tipsy.hoverState = 'out';
            if (options.delayOut == 0) {
            tipsy.hide();
            } else {
            setTimeout(function() { if (tipsy.hoverState == 'out') tipsy.hide(); }, options.delayOut);
            }
            };

            if (!options.live) this.each(function() { get(this); });

            if (options.trigger != 'manual') {
            var binder = options.live ? 'live' : 'bind',
            eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus',
            eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur';
            this[binder](eventIn, enter)[binder](eventOut, leave);
            }

            return this;

            };

            $.fn.tipsy.defaults = {
            delayIn: 0,
            delayOut: 0,
            fade: false,
            fallback: '',
            gravity: 'n',
            html: false,
            live: false,
            offset: 0,
            opacity: 0.8,
            title: 'title',
            trigger: 'hover'
            };

            // Overwrite this method to provide options on a per-element basis.
            // For example, you could store the gravity in a 'tipsy-gravity' attribute:
            // return $.extend({}, options, {gravity: $(ele).attr('tipsy-gravity') || 'n' });
            // (remember - do not modify 'options' in place!)
            $.fn.tipsy.elementOptions = function(ele, options) {
            return $.metadata ? $.extend({}, options, $(ele).metadata()) : options;
            };

            $.fn.tipsy.autoNS = function() {
            return $(this).offset().top > ($(document).scrollTop() + $(window).height() / 2) ? 's' : 'n';
            };

            $.fn.tipsy.autoWE = function() {
            return $(this).offset().left > ($(document).scrollLeft() + $(window).width() / 2) ? 'e' : 'w';
            };

            })(jQuery);
si Inregistrare


3.Adauga asta in P.A>Module>Gestiunea codurilor javascript> Creeaza un nou javascript > Vizibiltiate toate paginiile

Cod:

$(document).ready(function(){
$('[title]').tipsy({gravity: 'sw'});
});


2.Adauga asta in P.A>Afisare>Culori>Foaie de stil css

Cod:

              .tipsy {
                padding: 5px;
                font-size: 10px;
                position: absolute;
                z-index: 999;
                }

                .tipsy-inner {
                padding: 5px 8px 4px 8px;
                background-color: black;
                color: white;
                max-width: 200px;
                text-align: center;
                }

                .tipsy-inner {
                border-radius: 3px;
                -moz-border-radius:3px;
                -webkit-border-radius:3px;
                }

                .tipsy-arrow {
                position: absolute;
                background: url('http://onehackoranother.com/projects/jquery/tipsy/stylesheets/../images/tipsy.gif') no-repeat top left;
                width: 9px;
                height: 5px;
                }

                .tipsy-n .tipsy-arrow {
                top: 0;
                left: 50%;
                margin-left: -4px;
                }

                .tipsy-nw .tipsy-arrow {
                top: 0;
                left: 10px;
                }

                .tipsy-ne .tipsy-arrow {
                top: 0;
                right: 10px;
                }

                .tipsy-s .tipsy-arrow {
                bottom: 0;
                left: 50%;
                margin-left: -4px;
                background-position: bottom left;
                }

                .tipsy-sw .tipsy-arrow {
                bottom: 0;
                left: 10px;
                background-position: bottom left;
                }

                .tipsy-se .tipsy-arrow {
                bottom: 0;
                right: 10px;
                background-position: bottom left;
                }

                .tipsy-e .tipsy-arrow {
                top: 50%;
                margin-top: -4px;
                right: 0;
                width: 5px;
                height: 9px;
                background-position: top right;
                }

                .tipsy-w .tipsy-arrow {
                top: 50%;
                margin-top: -4px;
                left: 0;
                width: 5px;
                height: 9px;
                }

O explicare mai in detaliata puteti gasi aici [Trebuie sa fiti inscris si conectat pentru a vedea acest link] .

descriptionCerere Script EmptyRe: Cerere Script

more_horiz
Salutare , această problemă este rezolvată ? Cerere Script 230108 

descriptionCerere Script EmptyRe: Cerere Script

more_horiz
Nu.
Imi puteti da si pentru subforumuri.

descriptionCerere Script EmptyRe: Cerere Script

more_horiz
NuPermiT a scris:
Nu.
Imi puteti da si pentru subforumuri.

Mai exact, unde anume?

descriptionCerere Script EmptyRe: Cerere Script

more_horiz
Cum aveti dumneavoastra la sectiunea
Programare
HTML CSS  etc. cand mergeti de exemplu pe HTML va apare Descrierea acea.

Ultima editare efectuata de catre NuPermiT in Dum 20 Oct - 14:56, editata de 1 ori

descriptionCerere Script EmptyRe: Cerere Script

more_horiz
Panou de Administrare => Module => Gestiunea codurilor javascript => Creati un nou cod JavaScript

La amplasare: Toate paginile

Cod:

 // tipsy, facebook style tooltips for jquery
            // version 1.0.0a
            // (c) 2008-2010 jason frame [jason@onehackoranother.com]
            // releated under the MIT license
            (function($) {

            function fixTitle($ele) {
            if ($ele.attr('title') || typeof($ele.attr('original-title')) != 'string') {
            $ele.attr('original-title', $ele.attr('title') || '').removeAttr('title');
            }
            }

            function Tipsy(element, options) {
            this.$element = $(element);
            this.options = options;
            this.enabled = true;
            fixTitle(this.$element);
            }

            Tipsy.prototype = {
            show: function() {
            var title = this.getTitle();
            if (title && this.enabled) {
            var $tip = this.tip();

            $tip.find('.tipsy-inner')[this.options.html ? 'html' : 'text'](title);
            $tip[0].className = 'tipsy'; // reset classname in case of dynamic gravity
            $tip.remove().css({top: 0, left: 0, visibility: 'hidden', display: 'block'}).appendTo(document.body);

            var pos = $.extend({}, this.$element.offset(), {
            width: this.$element[0].offsetWidth,
            height: this.$element[0].offsetHeight
            });

            var actualWidth = $tip[0].offsetWidth, actualHeight = $tip[0].offsetHeight;
            var gravity = (typeof this.options.gravity == 'function')
            ? this.options.gravity.call(this.$element[0])
            : this.options.gravity;

            var tp;
            switch (gravity.charAt(0)) {
            case 'n':
            tp = {top: pos.top + pos.height + this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
            break;
            case 's':
            tp = {top: pos.top - actualHeight - this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2};
            break;
            case 'e':
            tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth - this.options.offset};
            break;
            case 'w':
            tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width + this.options.offset};
            break;
            }

            if (gravity.length == 2) {
            if (gravity.charAt(1) == 'w') {
            tp.left = pos.left + pos.width / 2 - 15;
            } else {
            tp.left = pos.left + pos.width / 2 - actualWidth + 15;
            }
            }

            $tip.css(tp).addClass('tipsy-' + gravity);

            if (this.options.fade) {
            $tip.stop().css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: this.options.opacity});
            } else {
            $tip.css({visibility: 'visible', opacity: this.options.opacity});
            }
            }
            },

            hide: function() {
            if (this.options.fade) {
            this.tip().stop().fadeOut(function() { $(this).remove(); });
            } else {
            this.tip().remove();
            }
            },

            getTitle: function() {
            var title, $e = this.$element, o = this.options;
            fixTitle($e);
            var title, o = this.options;
            if (typeof o.title == 'string') {
            title = $e.attr(o.title == 'title' ? 'original-title' : o.title);
            } else if (typeof o.title == 'function') {
            title = o.title.call($e[0]);
            }
            title = ('' + title).replace(/(^\s*|\s*$)/, "");
            return title || o.fallback;
            },

            tip: function() {
            if (!this.$tip) {
            this.$tip = $('<div class="tipsy"></div>').html('<div class="tipsy-arrow"></div><div class="tipsy-inner"/></div>');
            }
            return this.$tip;
            },

            validate: function() {
            if (!this.$element[0].parentNode) {
            this.hide();
            this.$element = null;
            this.options = null;
            }
            },

            enable: function() { this.enabled = true; },
            disable: function() { this.enabled = false; },
            toggleEnabled: function() { this.enabled = !this.enabled; }
            };

            $.fn.tipsy = function(options) {

            if (options === true) {
            return this.data('tipsy');
            } else if (typeof options == 'string') {
            return this.data('tipsy')[options]();
            }

            options = $.extend({}, $.fn.tipsy.defaults, options);

            function get(ele) {
            var tipsy = $.data(ele, 'tipsy');
            if (!tipsy) {
            tipsy = new Tipsy(ele, $.fn.tipsy.elementOptions(ele, options));
            $.data(ele, 'tipsy', tipsy);
            }
            return tipsy;
            }

            function enter() {
            var tipsy = get(this);
            tipsy.hoverState = 'in';
            if (options.delayIn == 0) {
            tipsy.show();
            } else {
            setTimeout(function() { if (tipsy.hoverState == 'in') tipsy.show(); }, options.delayIn);
            }
            };

            function leave() {
            var tipsy = get(this);
            tipsy.hoverState = 'out';
            if (options.delayOut == 0) {
            tipsy.hide();
            } else {
            setTimeout(function() { if (tipsy.hoverState == 'out') tipsy.hide(); }, options.delayOut);
            }
            };

            if (!options.live) this.each(function() { get(this); });

            if (options.trigger != 'manual') {
            var binder = options.live ? 'live' : 'bind',
            eventIn = options.trigger == 'hover' ? 'mouseenter' : 'focus',
            eventOut = options.trigger == 'hover' ? 'mouseleave' : 'blur';
            this[binder](eventIn, enter)[binder](eventOut, leave);
            }

            return this;

            };

            $.fn.tipsy.defaults = {
            delayIn: 0,
            delayOut: 0,
            fade: false,
            fallback: '',
            gravity: 'n',
            html: false,
            live: false,
            offset: 0,
            opacity: 0.8,
            title: 'title',
            trigger: 'hover'
            };

            // Overwrite this method to provide options on a per-element basis.
            // For example, you could store the gravity in a 'tipsy-gravity' attribute:
            // return $.extend({}, options, {gravity: $(ele).attr('tipsy-gravity') || 'n' });
            // (remember - do not modify 'options' in place!)
            $.fn.tipsy.elementOptions = function(ele, options) {
            return $.metadata ? $.extend({}, options, $(ele).metadata()) : options;
            };

            $.fn.tipsy.autoNS = function() {
            return $(this).offset().top > ($(document).scrollTop() + $(window).height() / 2) ? 's' : 'n';
            };

            $.fn.tipsy.autoWE = function() {
            return $(this).offset().left > ($(document).scrollLeft() + $(window).width() / 2) ? 'e' : 'w';
            };

            })(jQuery);

Panou de Administrare => Afisare => Culori => Foaie de stil CSS

Cod:

.tipsy {
            padding: 5px;
            font-size: 10px;
            position: absolute;
            z-index: 999;
            }

            .tipsy-inner {
            padding: 5px 8px 4px 8px;
            background-color: black;
            color: white;
            max-width: 200px;
            text-align: center;
            }

            .tipsy-inner {
            border-radius: 3px;
            -moz-border-radius:3px;
            -webkit-border-radius:3px;
            }

            .tipsy-arrow {
            position: absolute;
            background: url('http://onehackoranother.com/projects/jquery/tipsy/stylesheets/../images/tipsy.gif') no-repeat top left;
            width: 9px;
            height: 5px;
            }

            .tipsy-n .tipsy-arrow {
            top: 0;
            left: 50%;
            margin-left: -4px;
            }

            .tipsy-nw .tipsy-arrow {
            top: 0;
            left: 10px;
            }

            .tipsy-ne .tipsy-arrow {
            top: 0;
            right: 10px;
            }

            .tipsy-s .tipsy-arrow {
            bottom: 0;
            left: 50%;
            margin-left: -4px;
            background-position: bottom left;
            }

            .tipsy-sw .tipsy-arrow {
            bottom: 0;
            left: 10px;
            background-position: bottom left;
            }

            .tipsy-se .tipsy-arrow {
            bottom: 0;
            right: 10px;
            background-position: bottom left;
            }

            .tipsy-e .tipsy-arrow {
            top: 50%;
            margin-top: -4px;
            right: 0;
            width: 5px;
            height: 9px;
            background-position: top right;
            }

            .tipsy-w .tipsy-arrow {
            top: 50%;
            margin-top: -4px;
            left: 0;
            width: 5px;
            height: 9px;
            }

descriptionCerere Script EmptyRe: Cerere Script

more_horiz
Este tot acelasi.
Eu as dori sa imi apara si la Sub-Forumuri.
Adica descrierea in Tipsy Tooltip.

descriptionCerere Script EmptyRe: Cerere Script

more_horiz

Cod:

$(document).ready(function(){
$('[title], a, img').tipsy({gravity: 'sw'});
});

Rezolvat ?

descriptionCerere Script EmptyRe: Cerere Script

more_horiz
Rezolvat >> Arhivat

descriptionCerere Script EmptyRe: Cerere Script

more_horiz
privacy_tip Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum