testo alternativo

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.044
150
63
PR
www.borgo-italia.it
sto provando testo alternativo come da articolo "testo alternativo sui link con un layer" dell'esimio luca:rolleyes:.
tutto funziona su IE, ma su FF no rimane fisso solo il quadratino del layer.
come correggere?
:hammer:

p.s.
non c'entra niente, ma spesso per entrare nel for dopo user e pass mi da di benvenuto, ma al reindirizzamento (anche cliccando) da pagina non trovata.
dando qualche volta l'aggiorna, esco e mi ritrovo collegato. è un difetto mio?
 
Si, penso sia un difetto tuo :)

Mi sono accorto l'altro giorno del problema di quell'articolo.

E' molto vecchio e da allora le cose sono cambiate. Per fretta non ho risolto ma ti spiego come penso dovrebbe andare.

Non ho usato il DOM ma solo:

id_layer.proprietà

Prova con:

document.getElementById("id_layer").proprietà

e vedi se FF lo digerisce.

Diversamente bisogna giocare con i CSS e col posizionamento relativo/assoluto del layer.

Fammi sapere se ti riesce!
 
ciao
ho provato, ma forse ho fatto una put...ta

HTML:
<script language="javascript">
<!--
function Mostra(testo)
{
  livello.innerHTML = testo; // IMPOSTA IL TESTO NEL LIVELLO
  document.getElementById("id_layer").visibility="Visible";
  document.getElementById("id_layer").position="Absolute";
  document.getElementById("id_layer").left=event.clientX + 15;
  document.getElementById("id_layer").top=event.clientY + 15;
  //livello.style.visibility = "Visible"; // MOSTRA IL LIVELLO
  //livello.style.position = "Absolute"; // POSIZIONA IL LIVELLO IN MODALITA' ASSOLUTA
  //livello.style.left = event.clientX + 15; // IMPOSTA LE COORDINATE IN ORIZZONTALE
  //livello.style.top = event.clientY + 15; // IMPOSTA LE COORDINATE IN VERTICALE
}
function Nascondi()
{
  document.getElementById("id_layer").visibility="Hidden";
  //livello.style.visibility = "Hidden"; // NASCONDE IL LIVELLO
}
//-->
</script>

dove commentate lo righe originali
con FF che scriva in un modo che in un altro non funzia

con IE con document.get..... all'apertura dell pag non si vede testo
passando com mause appare ma non si muove e non scompare più
:dipser:
 
ciao luca
girando per il web ho trovato questo tooltip (che allego), funziona sia su IE che FF ed chrome
inoltre può essere variato con css interno o esterno in questi parametri:

HTML:
#ToolTip{
/*da CSS (onterno o esterno)
prende i seguenti parametri,
anche height
*/
font-size: 10px;
font-style: oblique;
text-transform: uppercase;
/*height:30px;*/
}


il tool viene richiamato con

HTML:
<h2>Tooltip dinamico</h2>
<p><a href="#" onMouseOver="toolTip('senza larghezza impostata vedere cosa succede')" onMouseOut="toolTip()">Esempio 1: default</a></p>
<p><a href="#" onMouseOver="toolTip('<b>BORGO ITALIA</b> com largezza 350px', 350)" onMouseOut="toolTip()">Esempio 2: settaggio larghezza</a></p>
<p>&nbsp;</p>

ciao:byebye:

NON riesco ad allegare ti invio il testo js

HTML:
/*
 +-------------------------------------------------------------------+
 |                   J S - T O O L T I P   (v1.2)                    |
 |                                                                   |
 | Copyright Gerd Tentler               info@gerd-tentler.de         |
 | Created: Feb. 15, 2005               Last modified: Mar. 1, 2005  |
 +-------------------------------------------------------------------+
 | This program may be used and hosted free of charge by anyone for  |
 | personal purpose as long as this copyright notice remains intact. |
 |                                                                   |
 | Obtain permission before selling the code for this program or     |
 | hosting this software on a commercial website or redistributing   |
 | this software over the Internet or in any other medium. In all    |
 | cases copyright must remain intact.                               |
 +-------------------------------------------------------------------+

======================================================================================================

 This script was tested with the following systems and browsers:

 - Windows XP: IE 6, NN 4, NN 7, Opera 7
 - Mac OS X:   IE 5, Safari 1

 If you use another browser or system, this script may not work for you - sorry.

------------------------------------------------------------------------------------------------------

 USAGE:

 Use the toolTip-function with mouse-over and mouse-out events (see example below).

 - To show a tooltip, use this syntax: toolTip(text, width in pixels, opacity in percent)
   Note: width and opacity are optional

 - To hide a tooltip, use this syntax: toolTip()

------------------------------------------------------------------------------------------------------

 EXAMPLE:

 <a href="#" onMouseOver="toolTip('Just a test', 150)" onMouseOut="toolTip()">some text here</a>

======================================================================================================
*/
  function TOOLTIP() {
//----------------------------------------------------------------------------------------------------
// Configuration
//----------------------------------------------------------------------------------------------------
    this.width = 200;                     // width (pixels)
    this.bgColor = '#FFFFFF';             // background color era #FFFFC0
    this.textColor = '#0000FF';           // text color
    this.borderColor = '#D00000';         // border color
    this.opacity = 80;                    // opacity (percent) - doesn't work with all browsers
    this.cursorDistance = 10;              // distance from cursor (pixels) era 5

    // don't change
    this.text = '';
    this.obj = 0;
    this.sobj = 0;
    this.active = false;

// -------------------------------------------------------------------------------------------------------
// Functions
// -------------------------------------------------------------------------------------------------------
    this.create = function() {
      if(!this.sobj) this.init();

      var t = '<table border=0 cellspacing=0 cellpadding=4 width=' + this.width + ' bgcolor=' + this.bgColor + '><tr>' +
              '<td align=center><font color=' + this.textColor + '>' + this.text + '</font></td></tr></table>';

      if(document.layers) {
        t = '<table border=0 cellspacing=0 cellpadding=1><tr><td bgcolor=' + this.borderColor + '>' + t + '</td></tr></table>';
        this.sobj.document.write(t);
        this.sobj.document.close();
      }
      else {
        this.sobj.border = '1px solid ' + this.borderColor;
        this.setOpacity();
        if(document.getElementById) document.getElementById('ToolTip').innerHTML = t;
        else document.all.ToolTip.innerHTML = t;
      }
      this.show();
    }

    this.init = function() {
      if(document.getElementById) {
        this.obj = document.getElementById('ToolTip');
        this.sobj = this.obj.style;
      }
      else if(document.all) {
        this.obj = document.all.ToolTip;
        this.sobj = this.obj.style;
      }
      else if(document.layers) {
        this.obj = document.ToolTip;
        this.sobj = this.obj;
      }
    }

    this.show = function() {
      var ext = (document.layers ? '' : 'px');
      var left = mouseX;

      if(left + this.width + this.cursorDistance > winX) left -= this.width + this.cursorDistance;
      else left += this.cursorDistance;

      this.sobj.left = left + ext;
      this.sobj.top = mouseY + this.cursorDistance + ext;

      if(!this.active) {
        this.sobj.visibility = 'visible';
        this.active = true;
      }
    }

    this.hide = function() {
      if(this.sobj) this.sobj.visibility = 'hidden';
      this.active = false;
    }

    this.setOpacity = function() {
      this.sobj.filter = 'alpha(opacity=' + this.opacity + ')';
      this.sobj.mozOpacity = '.1';
      if(this.obj.filters) this.obj.filters.alpha.opacity = this.opacity;
      if(!document.all && this.sobj.setProperty) this.sobj.setProperty('-moz-opacity', this.opacity / 100, '');
    }
  }

//----------------------------------------------------------------------------------------------------
// Build layer, get mouse coordinates and window width, create tooltip-object
//----------------------------------------------------------------------------------------------------
  var tooltip = mouseX = mouseY = winX = 0;

  if(document.layers) {
    document.write('<layer id="ToolTip"></layer>');
    document.captureEvents(Event.MOUSEMOVE);
  }
  else document.write('<div id="ToolTip" style="position:absolute; z-index:99"></div>');
  document.onmousemove = getMouseXY;

  function getMouseXY(e) {
    if(document.all) {
      mouseX = event.clientX + document.body.scrollLeft;
      mouseY = event.clientY + document.body.scrollTop;
    }
    else {
      mouseX = e.pageX;
      mouseY = e.pageY;
    }
    if(mouseX < 0) mouseX = 0;
    if(mouseY < 0) mouseY = 0;

    if(document.body && document.body.offsetWidth) winX = document.body.offsetWidth - 25;
    else if(window.innerWidth) winX = window.innerWidth - 25;
    else winX = screen.width - 25;

    if(tooltip && tooltip.active) tooltip.show();
  }

  function toolTip(text, width, opacity) {
    if(text) {
      tooltip = new TOOLTIP();
      tooltip.text = text;
      if(width) tooltip.width = width;
      if(opacity) tooltip.opacity = opacity;
      tooltip.create();
    }
    else if(tooltip) tooltip.hide();
  }
 
ennesimo quesito.
usualmente in js si carica con

HTML:
<script language="JavaScript" src="tooltip.js"></script>

soltanto che sto facendo un sito in cui le pagine hanno per ciascuna sezione un colore/sfondo diverso per cui dovrei adattare il vari parametri del tootip alla pagina
secondo voi è possibile operare in questo modo, cioè insisrire tra <head></head> il seguente codice?

Questa è: pagina.php

PHP:
<?php
$width=200;
$bgColor=”#FFFFFF”;
$texxColor=#0000FF”;
$textAling=”right”;
……………
……………
include_once “tooltip.js”;
…………..
?>

E questo il file tooltip.js

PHP:
?> <script language="JavaScript" type="text/JavaScript">
<!--

function TOOLTIP() {

……….
this.width = <?php echo $width ;?>;                     // width (pixels)
this.bgColor = ‘<?php echo $bgColor;?> ‘;             // background color era #FFFFC0
this.textColor = ‘<?php echo $bgColor;?>’;           // text color
…………
……..
}
//-->
</script> <?php

grazie e ciao a tutti
 
ehm..ehm....ti ho fatto le corna:)
non ho usato il tuo codice, ma un'altro trovato navigando, il codice completo che sto utilizzando lo trovi in un post sopra (13.09.2008 11.04.21), funzia IE e FF

ed e quello che vorrei modificare
:beer:
 

Discussioni simili