Ciao a tutti, riapro questo discussione perche' da solo non esco.
Come da titolo in una pagina che elenca dei record reperiti con un sql, ho messo
affianco a ogni riga un div fatto con ajax-tooltip, il problema e' che il div che appare quando si passa sopra a un record non ha posizione fissa ma viene aperto in base alla posizione della riga, quindi se provo a aprirlo es. per la decima riga il div scompare in basso
perche' non e' in primo piano e perche' non ha posizione fissa.
Ora veniamo alla richiesta, come faccio a modificare i tre file .js per fare in modo che esca
sempre a top es. 100?
grazie in anticipo, posto i tre file .js
1° ajax-tooltip.js
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;
}
2° ajax-dynamic-content.js
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
}
3° ajax.js
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();
}
Io ammetto di non capirci niente ne di javascript ne di ajax, quindi non so neanche da dove iniziare.