Visualizzazione dei risultati da 1 a 2 su 2
  1. #1
    Utente di HTML.it
    Registrato dal
    Aug 2006
    Messaggi
    833

    ajax.tooltip: Position absolute forse e' un problema .js

    Ciao a tutti, ho provato a utilizzare l'ajax-tooltip per visualizzare dei dati presi da un sql, tutto funziona perfettamette solo che il div che viene visualizzato quando passo sopra a uno dei record dell'elenco non ha posizione fissa. Questo e' un problema perche' se passo sopra a un record in basso della pagina il div non viene visualizzato.

    Ora dal CSS abbiamo provato a fare delle modifiche ma non ci siamo riusciti, quindi spero che sia una modifica da fare nei file .js

    Posto i tre file. Ciao

    codice:
    /* Offset position of tooltip */
    var x_offset_tooltip = 5;
    var y_offset_tooltip = 10;
    
    /* Don't change anything below here */
    
    
    var ajax_tooltipObj = false;
    var ajax_tooltipObj_iframe = false;
    
    var ajax_tooltip_MSIE = false;
    if(navigator.userAgent.indexOf('MSIE')>=0)ajax_tooltip_MSIE=true;
    
    
    function ajax_showTooltip(externalFile,inputObj)
    {
    	if(!ajax_tooltipObj)	/* Tooltip div not created yet ? */
    	{
    		ajax_tooltipObj = document.createElement('DIV');
    		ajax_tooltipObj.style.position = 'absolute';
    		ajax_tooltipObj.id = 'ajax_tooltipObj';		
    		document.body.appendChild(ajax_tooltipObj);
    
    		
    		var leftDiv = document.createElement('DIV');	/* Create arrow div */
    		leftDiv.className='ajax_tooltip_arrow';
    		leftDiv.id = 'ajax_tooltip_arrow';
    		ajax_tooltipObj.appendChild(leftDiv);
    		
    		var contentDiv = document.createElement('DIV'); /* Create tooltip content div */
    		contentDiv.className = 'ajax_tooltip_content';
    		ajax_tooltipObj.appendChild(contentDiv);
    		contentDiv.id = 'ajax_tooltip_content';
    		
    		if(ajax_tooltip_MSIE){	/* Create iframe object for MSIE in order to make the tooltip cover select boxes */
    			ajax_tooltipObj_iframe = document.createElement('<IFRAME frameborder="0">');
    			ajax_tooltipObj_iframe.style.position = 'absolute';
    			ajax_tooltipObj_iframe.border='0';
    			ajax_tooltipObj_iframe.frameborder=0;
    			ajax_tooltipObj_iframe.style.backgroundColor='#FFF';
    			ajax_tooltipObj_iframe.src = 'about:blank';
    			contentDiv.appendChild(ajax_tooltipObj_iframe);
    			ajax_tooltipObj_iframe.style.left = '0px';
    			ajax_tooltipObj_iframe.style.top = '0px';
    		}
    
    			
    	}
    	// Find position of tooltip
    	ajax_tooltipObj.style.display='block';
    	ajax_loadContent('ajax_tooltip_content',externalFile);
    	if(ajax_tooltip_MSIE){
    		ajax_tooltipObj_iframe.style.width = ajax_tooltipObj.clientWidth + 'px';
    		ajax_tooltipObj_iframe.style.height = ajax_tooltipObj.clientHeight + 'px';
    	}
    
    	ajax_positionTooltip(inputObj);
    }
    
    function ajax_positionTooltip(inputObj)
    {
    	var leftPos = (ajaxTooltip_getLeftPos(inputObj) + inputObj.offsetWidth);
    	var topPos = ajaxTooltip_getTopPos(inputObj);
    	
    	/*
    	var rightedge=ajax_tooltip_MSIE? document.body.clientWidth-leftPos : window.innerWidth-leftPos
    	var bottomedge=ajax_tooltip_MSIE? document.body.clientHeight-topPos : window.innerHeight-topPos
    	*/
    	var tooltipWidth = document.getElementById('ajax_tooltip_content').offsetWidth +  document.getElementById('ajax_tooltip_arrow').offsetWidth; 
    	// Dropping this reposition for now because of flickering
    	//var offset = tooltipWidth - rightedge; 
    	//if(offset>0)leftPos = Math.max(0,leftPos - offset - 5);
    	
    	ajax_tooltipObj.style.left = leftPos + 'px';
    	ajax_tooltipObj.style.top = topPos + 'px';	
    	
    	
    }
    
    
    function ajax_hideTooltip()
    {
    	ajax_tooltipObj.style.display='none';
    }
    
    function ajaxTooltip_getTopPos(inputObj)
    {		
      var returnValue = inputObj.offsetTop;
      while((inputObj = inputObj.offsetParent) != null){
      	if(inputObj.tagName!='HTML')returnValue += inputObj.offsetTop;
      }
      return returnValue;
    }
    
    function ajaxTooltip_getLeftPos(inputObj)
    {
      var returnValue = inputObj.offsetLeft;
      while((inputObj = inputObj.offsetParent) != null){
      	if(inputObj.tagName!='HTML')returnValue += inputObj.offsetLeft;
      }
      return returnValue;
    }
    secondo script

    codice:
    var enableCache = true;
    var jsCache = new Array();
    
    var dynamicContent_ajaxObjects = new Array();
    
    function ajax_showContent(divId,ajaxIndex,url)
    {
    	document.getElementById(divId).innerHTML = dynamicContent_ajaxObjects[ajaxIndex].response;
    	if(enableCache){
    		jsCache[url] = 	dynamicContent_ajaxObjects[ajaxIndex].response;
    	}
    	dynamicContent_ajaxObjects[ajaxIndex] = false;
    }
    
    function ajax_loadContent(divId,url)
    {
    	if(enableCache && jsCache[url]){
    		document.getElementById(divId).innerHTML = jsCache[url];
    		return;
    	}
    	
    	var ajaxIndex = dynamicContent_ajaxObjects.length;
    	document.getElementById(divId).innerHTML = 'Loading content - please wait';
    	dynamicContent_ajaxObjects[ajaxIndex] = new sack();
    	
    	if(url.indexOf('?')>=0){
    		dynamicContent_ajaxObjects[ajaxIndex].method='GET';
    		var string = url.substring(url.indexOf('?'));
    		url = url.replace(string,'');
    		string = string.replace('?','');
    		var items = string.split(/&/g);
    		for(var no=0;no<items.length;no++){
    			var tokens = items[no].split('=');
    			if(tokens.length==2){
    				dynamicContent_ajaxObjects[ajaxIndex].setVar(tokens[0],tokens[1]);
    			}	
    		}	
    		url = url.replace(string,'');
    	}
    	
    	dynamicContent_ajaxObjects[ajaxIndex].requestFile = url;	// Specifying which file to get
    	dynamicContent_ajaxObjects[ajaxIndex].onCompletion = function(){ ajax_showContent(divId,ajaxIndex,url); };	// Specify function that will be executed after file has been found
    	dynamicContent_ajaxObjects[ajaxIndex].runAJAX();		// Execute AJAX function	
    
    }
    terzo script

    codice:
    function sack(file){
    	this.AjaxFailedAlert = "Your browser does not support the enhanced functionality of this website, and therefore you will have an experience that differs from the intended one.\n";
    	this.requestFile = file;
    	this.method = "GET";
    	this.URLString = "";
    	this.encodeURIString = true;
    	this.execute = false;
    
    	this.onLoading = function() { };
    	this.onLoaded = function() { };
    	this.onInteractive = function() { };
    	this.onCompletion = function() { };
    
    	this.createAJAX = function() {
    		try {
    			this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    		} catch (e) {
    			try {
    				this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    			} catch (err) {
    				this.xmlhttp = null;
    			}
    		}
    		if(!this.xmlhttp && typeof XMLHttpRequest != "undefined")
    			this.xmlhttp = new XMLHttpRequest();
    		if (!this.xmlhttp){
    			this.failed = true; 
    		}
    	};
    	
    	this.setVar = function(name, value){
    		if (this.URLString.length < 3){
    			this.URLString = name + "=" + value;
    		} else {
    			this.URLString += "&" + name + "=" + value;
    		}
    	}
    	
    	this.encVar = function(name, value){
    		var varString = encodeURIComponent(name) + "=" + encodeURIComponent(value);
    	return varString;
    	}
    	
    	this.encodeURLString = function(string){
    		varArray = string.split('&');
    		for (i = 0; i < varArray.length; i++){
    			urlVars = varArray[i].split('=');
    			if (urlVars[0].indexOf('amp;') != -1){
    				urlVars[0] = urlVars[0].substring(4);
    			}
    			varArray[i] = this.encVar(urlVars[0],urlVars[1]);
    		}
    	return varArray.join('&');
    	}
    	
    	this.runResponse = function(){
    		eval(this.response);
    	}
    	
    	this.runAJAX = function(urlstring){
    		this.responseStatus = new Array(2);
    		if(this.failed && this.AjaxFailedAlert){ 
    			alert(this.AjaxFailedAlert); 
    		} else {
    			if (urlstring){ 
    				if (this.URLString.length){
    					this.URLString = this.URLString + "&" + urlstring; 
    				} else {
    					this.URLString = urlstring; 
    				}
    			}
    			if (this.encodeURIString){
    				var timeval = new Date().getTime(); 
    				this.URLString = this.encodeURLString(this.URLString);
    				this.setVar("rndval", timeval);
    			}
    			if (this.element) { this.elementObj = document.getElementById(this.element); }
    			if (this.xmlhttp) {
    				var self = this;
    				if (this.method == "GET") {
    					var totalurlstring = this.requestFile + "?" + this.URLString;
    					this.xmlhttp.open(this.method, totalurlstring, true);
    				} else {
    					this.xmlhttp.open(this.method, this.requestFile, true);
    				}
    				if (this.method == "GET"){
      					try {
    						this.xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded')  
    					} catch (e) {}
    				}
    
    				this.xmlhttp.send(this.URLString);
    				this.xmlhttp.onreadystatechange = function() {
    					switch (self.xmlhttp.readyState){
    						case 1:
    							self.onLoading();
    						break;
    						case 2:
    							self.onLoaded();
    						break;
    						case 3:
    							self.onInteractive();
    						break;
    						case 4:
    							self.response = self.xmlhttp.responseText;
    							self.responseXML = self.xmlhttp.responseXML;
    							self.responseStatus[0] = self.xmlhttp.status;
    							self.responseStatus[1] = self.xmlhttp.statusText;
    							self.onCompletion();
    							if(self.execute){ self.runResponse(); }
    							if (self.elementObj) {
    								var elemNodeName = self.elementObj.nodeName;
    								elemNodeName.toLowerCase();
    								if (elemNodeName == "input" || elemNodeName == "select" || elemNodeName == "option" || elemNodeName == "textarea"){
    									self.elementObj.value = self.response;
    								} else {
    									self.elementObj.innerHTML = self.response;
    								}
    							}
    							self.URLString = "";
    						break;
    					}
    				};
    			}
    		}
    	};
    this.createAJAX();
    }

  2. #2
    Utente di HTML.it L'avatar di Xinod
    Registrato dal
    Sep 2000
    Messaggi
    13,649
    una sola discussione in un unico forum,
    ne hai gia' una in css

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.