• 11-12-2012, 02:38:32
    #1
    Merhaba arkadaslar;
    İçinden çıkamadığım bir durum var.
    jGrowl'da sayfanın sağına geldiğimde ve bir resimde önizleme yapmak istediğimde kaydırma çubukları oluşuyor.Ne yaptıysam bu sorun çözülmedi

    Bu sorunu nasıl çözebilirim

    jGrowl.js içeriği

    (function($) {
    
    	/** jGrowl Wrapper - Establish a base jGrowl Container for compatibility with older releases. **/
    	$.jGrowl = function( m , o ) {
    		// To maintain compatibility with older version that only supported one instance we'll create the base container.
    		if ( $('#jGrowl').size() == 0 ) 
    			$('<div id="jGrowl"></div>').addClass( (o && o.position) ? o.position : $.jGrowl.defaults.position ).appendTo('body');
    
    		// Create a notification on the container.
    		$('#jGrowl').jGrowl(m,o);
    	};
    
    
    	/** Raise jGrowl Notification on a jGrowl Container **/
    	$.fn.jGrowl = function( m , o ) {
    		if ( $.isFunction(this.each) ) {
    			var args = arguments;
    
    			return this.each(function() {
    				var self = this;
    
    				/** Create a jGrowl Instance on the Container if it does not exist **/
    				if ( $(this).data('jGrowl.instance') == undefined ) {
    					$(this).data('jGrowl.instance', $.extend( new $.fn.jGrowl(), { notifications: [], element: null, interval: null } ));
    					$(this).data('jGrowl.instance').startup( this );
    				}
    
    				/** Optionally call jGrowl instance methods, or just raise a normal notification **/
    				if ( $.isFunction($(this).data('jGrowl.instance')[m]) ) {
    					$(this).data('jGrowl.instance')[m].apply( $(this).data('jGrowl.instance') , $.makeArray(args).slice(1) );
    				} else {
    					$(this).data('jGrowl.instance').create( m , o );
    				}
    			});
    		};
    	};
    
    	$.extend( $.fn.jGrowl.prototype , {
    
    		/** Default JGrowl Settings **/
    		defaults: {
    			pool: 			0,
    			header: 		'',
    			group: 			'',
    			sticky: 		false,
    			position: 		'absolute',
    			glue: 			'after',
    			theme: 			'default',
    			themeState: 	'highlight',
    			corners: 		'10px',
    			check: 			250,
    			life: 			3000,
    			closeDuration:  'normal',
    			openDuration:   'normal',
    			easing: 		'swing',
    			closer: 		true,
    			closeTemplate: '&times;',
    			closerTemplate: '<div>[ Çûêğûòü âñå îêíà ]</div>',
    			log: 			function(e,m,o) {},
    			beforeOpen: 	function(e,m,o) {},
    			afterOpen: 		function(e,m,o) {},
    			open: 			function(e,m,o) {},
    			beforeClose: 	function(e,m,o) {},
    			close: 			function(e,m,o) {},
    			animateOpen: 	{
    				opacity: 	'show'
    			},
    			animateClose: 	{
    				opacity: 	'hide'
    			}
    		},
    		
    		notifications: [],
    		
    		/** jGrowl Container Node **/
    		element: 	null,
    	
    		/** Interval Function **/
    		interval:   null,
    		
    		/** Create a Notification **/
    		create: 	function( message , o ) {
    			var o = $.extend({}, this.defaults, o);
    
    			/* To keep backward compatibility with 1.24 and earlier, honor 'speed' if the user has set it */
    			if (typeof o.speed !== 'undefined') {
    				o.openDuration = o.speed;
    				o.closeDuration = o.speed;
    			}
    
    			this.notifications.push({ message: message , options: o });
    			
    			o.log.apply( this.element , [this.element,message,o] );
    		},
    		
    		render: 		function( notification ) {
    			var self = this;
    			var message = notification.message;
    			var o = notification.options;
    
    			// Support for jQuery theme-states, if this is not used it displays a widget header
    			o.themeState = (o.themeState == '') ? '' : 'ui-state-' + o.themeState;
    
    			var notification = $(
    				'<div class="jGrowl-notification ' + o.themeState + ' ui-corner-all' + 
    				((o.group != undefined && o.group != '') ? ' ' + o.group : '') + '">' +
    				'<div class="jGrowl-close">' + o.closeTemplate + '</div>' +
    				'<div class="jGrowl-header">' + o.header + '</div>' +
    				'<div class="jGrowl-message">' + message + '</div></div>'
    			).data("jGrowl", o).addClass(o.theme).children('div.jGrowl-close').bind("click.jGrowl", function() {
    				$(this).parent().trigger('jGrowl.close');
    			}).parent();
    
    
    			/** Notification Actions **/
    			$(notification).bind("mouseover.jGrowl", function() {
    				$('div.jGrowl-notification', self.element).data("jGrowl.pause", true);
    			}).bind("mouseout.jGrowl", function() {
    				$('div.jGrowl-notification', self.element).data("jGrowl.pause", false);
    			}).bind('jGrowl.beforeOpen', function() {
    				if ( o.beforeOpen.apply( notification , [notification,message,o,self.element] ) != false ) {
    					$(this).trigger('jGrowl.open');
    				}
    			}).bind('jGrowl.open', function() {
    				if ( o.open.apply( notification , [notification,message,o,self.element] ) != false ) {
    					if ( o.glue == 'after' ) {
    						$('div.jGrowl-notification:last', self.element).after(notification);
    					} else {
    						$('div.jGrowl-notification:first', self.element).before(notification);
    					}
    					
    					$(this).animate(o.animateOpen, o.openDuration, o.easing, function() {
    						// Fixes some anti-aliasing issues with IE filters.
    						if ($.browser.msie && (parseInt($(this).css('opacity'), 10) === 1 || parseInt($(this).css('opacity'), 10) === 0))
    							this.style.removeAttribute('filter');
    
    						if ( $(this).data("jGrowl") != null ) // Happens when a notification is closing before it's open.
    							$(this).data("jGrowl").created = new Date();
    						
    						$(this).trigger('jGrowl.afterOpen');
    					});
    				}
    			}).bind('jGrowl.afterOpen', function() {
    				o.afterOpen.apply( notification , [notification,message,o,self.element] );
    			}).bind('jGrowl.beforeClose', function() {
    				if ( o.beforeClose.apply( notification , [notification,message,o,self.element] ) != false )
    					$(this).trigger('jGrowl.close');
    			}).bind('jGrowl.close', function() {
    				// Pause the notification, lest during the course of animation another close event gets called.
    				$(this).data('jGrowl.pause', true);
    				$(this).animate(o.animateClose, o.closeDuration, o.easing, function() {
    					if ( $.isFunction(o.close) ) {
    						if ( o.close.apply( notification , [notification,message,o,self.element] ) !== false )
    							$(this).remove();
    					} else {
    						$(this).remove();
    					}
    				});
    			}).trigger('jGrowl.beforeOpen');
    		
    			/** Optional Corners Plugin **/
    			if ( o.corners != '' && $.fn.corner != undefined ) $(notification).corner( o.corners );
    
    			/** Add a Global Closer if more than one notification exists **/
    			if ( $('div.jGrowl-notification:parent', self.element).size() > 1 && 
    				 $('div.jGrowl-closer', self.element).size() == 0 && this.defaults.closer != false ) {
    				$(this.defaults.closerTemplate).addClass('jGrowl-closer ' + this.defaults.themeState + ' ui-corner-all').addClass(this.defaults.theme)
    					.appendTo(self.element).animate(this.defaults.animateOpen, this.defaults.speed, this.defaults.easing)
    					.bind("click.jGrowl", function() {
    						$(this).siblings().trigger("jGrowl.beforeClose");
    
    						if ( $.isFunction( self.defaults.closer ) ) {
    							self.defaults.closer.apply( $(this).parent()[0] , [$(this).parent()[0]] );
    						}
    					});
    			};
    		},
    
    		/** Update the jGrowl Container, removing old jGrowl notifications **/
    		update:	 function() {
    			$(this.element).find('div.jGrowl-notification:parent').each( function() {
    				if ( $(this).data("jGrowl") != undefined && $(this).data("jGrowl").created != undefined && 
    					 ($(this).data("jGrowl").created.getTime() + parseInt($(this).data("jGrowl").life))  < (new Date()).getTime() && 
    					 $(this).data("jGrowl").sticky != true && 
    					 ($(this).data("jGrowl.pause") == undefined || $(this).data("jGrowl.pause") != true) ) {
    
    					// Pause the notification, lest during the course of animation another close event gets called.
    					$(this).trigger('jGrowl.beforeClose');
    				}
    			});
    
    			if ( this.notifications.length > 0 && 
    				 (this.defaults.pool == 0 || $(this.element).find('div.jGrowl-notification:parent').size() < this.defaults.pool) )
    				this.render( this.notifications.shift() );
    
    			if ( $(this.element).find('div.jGrowl-notification:parent').size() < 2 ) {
    				$(this.element).find('div.jGrowl-closer').animate(this.defaults.animateClose, this.defaults.speed, this.defaults.easing, function() {
    					$(this).remove();
    				});
    			}
    		},
    
    		/** Setup the jGrowl Notification Container **/
    		startup:	function(e) {
    			this.element = $(e).addClass('jGrowl').append('<div class="jGrowl-notification"></div>');
    			this.interval = setInterval( function() { 
    				$(e).data('jGrowl.instance').update(); 
    			}, parseInt(this.defaults.check));
    			
    			if ($.browser.msie && parseInt($.browser.version) < 7 && !window["XMLHttpRequest"]) {
    				$(this.element).addClass('ie6');
    			}
    		},
    
    		/** Shutdown jGrowl, removing it and clearing the interval **/
    		shutdown:   function() {
    			$(this.element).removeClass('jGrowl').find('div.jGrowl-notification').remove();
    			clearInterval( this.interval );
    		},
    		
    		close: 	function() {
    			$(this.element).find('div.jGrowl-notification').each(function(){
    				$(this).trigger('jGrowl.beforeClose');
    			});
    		}
    	});
    	
    	/** Reference the Defaults Object for compatibility with older versions of jGrowl **/
    	$.jGrowl.defaults = $.fn.jGrowl.prototype.defaults;
    
    })(jQuery);
    
    /*ToolTip*/
    (function ($) {
    	
    	$(document).ready(function() {
            $("a").easyTooltip();
            $("img").easyTooltip();
            $("div").easyTooltip();
        });
    	
    	$.fn.easyTooltip = function (b) {
    		var c = {
    			xOffset: 12,
    			yOffset: 20,
    			tooltipId: "easyTooltip",
    			clickRemove: false,
    			content: "",
    			useElement: ""
    		};
    		var b = $.extend(c, b);
    		var d;
    		this.each(function () {
    			var a = $(this).attr("title");
    			$(this).hover(function (e) {
    				d = (b.content != "") ? b.content : a;
    				d = (b.useElement != "") ? $("#" + b.useElement).html() : d;
    				$(this).attr("title", "");
    				if (d != "" && d != undefined) {
    					$("body").append("<div id='" + b.tooltipId + "'><div class='easyTooltip'>" + d + "</div></div>");
    					$("#" + b.tooltipId).css("position", "absolute").css("top", (e.pageY - b.yOffset) + "px").css("left", (e.pageX + b.xOffset) + "px").css("display", "none").fadeIn("fast")
    				}
    			}, function () {
    				$("#" + b.tooltipId).remove();
    				$(this).attr("title", a)
    			});
    			$(this).mousemove(function (e) {
    				$("#" + b.tooltipId).css("top", (e.pageY - b.yOffset) + "px").css("left", (e.pageX + b.xOffset) + "px")
    			});
    			if (b.clickRemove) {
    				$(this).mousedown(function (e) {
    					$("#" + b.tooltipId).remove();
    					$(this).attr("title", a)
    				})
    			}
    		})
    	}
    })(jQuery);// JavaScript Document
    css içeriği

    .easyTooltip {
    	background: url('images/bubble.png') top left fixed;
    	padding: 5px 8px;
    	margin: 0px;
    	font-size:11px;
    	color: #FFFFFF;
    	line-height: 14px;
    	width: 250px;
    	z-index: 13000;
    	-moz-border-radius: 5px;
    	-webkit-border-radius: 5px;
    	-khtml-border-radius: 5px;
    	border-radius: 5px;
    }
    Şimdiden teşekkürler.
  • 12-12-2012, 09:29:42
    #2
    Kimlik doğrulama veya yönetimden onay bekliyor.
    Css'e
     overflow: hidden;
    ekleyip dener misin.
  • 12-12-2012, 18:06:10
    #3
    Onu yapmıstım ama malesef olmadı
  • 12-12-2012, 18:39:01
    #4
    body {overflow-x;hidden}
    dener misin.
    nerede kaydırma çubukları çıkıyor anlamadım..
  • 12-12-2012, 18:44:23
    #5
    cudjex adlı üyeden alıntı: mesajı görüntüle
    body {overflow-x;hidden}
    dener misin.
    nerede kaydırma çubukları çıkıyor anlamadım..
    Sayfanın sağ tarafına doğru.Dediğim gibi tooltip için kullanıyorum.Sitenin sağına doğru geldiğimde ve ipucu açıldığında blok dar olduğu için sayfada kaydırma çubukları çıkıyor.
  • 12-12-2012, 18:50:37
    #6
    sever2k7 adlı üyeden alıntı: mesajı görüntüle
    Sayfanın sağ tarafına doğru.Dediğim gibi tooltip için kullanıyorum.Sitenin sağına doğru geldiğimde ve ipucu açıldığında blok dar olduğu için sayfada kaydırma çubukları çıkıyor.
    dediğimi eklediniz mi?düzelmesi gerek o halde.stil dosyanızın en altında ekleyin
  • 12-12-2012, 19:23:29
    #7
    Hocam çok çok teşekkür ederim.Önbelleği temizleyince oldu.Çok saolun.İyi çalışmalar, saygılar
  • 12-12-2012, 19:24:30
    #8
    sever2k7 adlı üyeden alıntı: mesajı görüntüle
    Hocam çok çok teşekkür ederim.Önbelleği temizleyince oldu.Çok saolun.İyi çalışmalar, saygılar
    ön belleği temizlemeye gerek yoktu bence f5 yapsanız yeter.size de iyi çalışmalar.