Aprire/chiudere Finestre con img

**Mr_Photoshop** · 16-02-2007, 16:41

In questa pagina vorrei eliminare il testo apri/chiudi con immagini

in locale provo cosi' ma non va'

<SCRIPT type=text/javascript>
function dropdown(layer_id, anchor_id) {
var layer = document.getElementById(layer_id);
var anchor = document.getElementById(anchor_id);
if(layer.style.display == 'none') {
layer.style.display = 'block';
anchor.innerHTML = '[CHIUDI]'; //modif. '<img scr="tutorial_img/chiudi.gif">';
} else if(layer.style.display == 'block') {
layer.style.display = 'none';
anchor.innerHTML = '[APRI]'; // modif. '<img scr="tutorial_img/apri.gif">';
}
}
</SCRIPT>

<td align="CENTER" class="tblack2" valign="top" width="408">
PHOTOSHOP[APRI]<div id="layer_Photoshop" style="display: none; width:399; height:181">

qui invece al posto di [APRI] metto
[img]tutorial_img/apri.gif[/img]

non va !!!!!!! Grazie a presto Michele R.

**sonik_the_sonik** · 16-02-2007, 17:00

Ti puoi spiegare meglio?

**Mr_Photoshop** · 16-02-2007, 17:31

Originariamente inviato da sonik_the_sonik

Ti puoi spiegare meglio?

Guarda questa pagina
1) Vorrei eliminare il testo [Apri] e mettere l'img apri.gif
2)quando la finestra e' aperta voglio sostituire il testo [CHIUI] e mettere l'img chiudi.gif

be poi chiaramente al posto dei testi Photoshop e Fireworks ci metto le immagini di esempio "testata.gif" poi in realta mettero' user bar animate.(questo non'e' un problema) In sintesi l'img apri.gif deve aprire la finestra e l'img chiudi.gif deve chiuderla...

Sai come fare?????
Intanto ti ringrazio per il tuo tempo A presto Michele R.

**Kea BD** · 17-02-2007, 11:29

basterebbe mettere un tag <img> all'interno del link piuttosto che "[APRI]"

cioè invece di

codice:

<td align="CENTER" class="tblack2" valign="top" width="412">
FIREWORKS [APRI]
<div id="layer_Fireworks" style="display: none; width:399; height:145">

dovresti mettere

codice:

<td align="CENTER" class="tblack2" valign="top" width="412">
FIREWORKS <A id=anchor_Fireworks style="FONT-WEIGHT: bold; COLOR: #000099"
href="javascript:dropdown('layer_Fireworks','anchor_Fireworks');">
[img]immagine_apri.gif[/img]</A>
<div id="layer_Fireworks" style="display: none; width:399; height:145">

poi dal codice javascript cambi l'immagine visualizzata così

codice:

document.nomeimg.src="immagine_chiudi.gif";

ricordati di dare nomi diversi alle due immagini, quella per photoshop ad esempio può essere img_ps mentre quella per fireworks può essere img_fw.

**Mr_Photoshop** · 17-02-2007, 15:45

OK Facciamo finta che mi serve solo la finestra Photoshop

codice:

<div align="center">
<table width="352" height="35" cellspacing="0" style="border-collapse:collapse" cellpadding="0" background="tutorial_img/batik01.jpg">
<tr>
<td align="left" class="tblack2" valign="top" width="408">
[img]tutorial_img/testata_p.gif[/img][img]tutorial_img/apri.gif[/img]<div id="layer_Photoshop" style="display: none; width:399; height:189">
<table border="0" cellpadding="4" cellspacing="5" width="100%">
<td align="LEFT" class="box_completo">


TUTORIAL 1</p>


TUTORIAL 2</p>


TUTORIAL 3</p>


TUTORIAL 4</p>


TUTORIAL 5

</p>
</div></td>
</tr>
</table>

Dome metto questo?

codice:

document.nomeimg.src="immagine_chiudi.gif";

in questo script?

codice:

<script type="text/javascript">
function dropdown(layer_id, anchor_id) {
var layer = document.getElementById(layer_id);
var anchor = document.getElementById(anchor_id);
if(layer.style.display == 'none') {
layer.style.display = 'block';
anchor.innerHTML = '[Chiudi Lista]'; //////  elimino questo????   
} else if(layer.style.display == 'block') {
layer.style.display = 'none';
anchor.innerHTML = '[Apri Lista]';  //////  elimino questo????  
}
}
</script>

puoi dare un'occhiata a questa pagina? -----GRAZIE per la tua disponibilita' a presto Michele R.

**Kea BD** · 17-02-2007, 16:04

provala così, a me funziona cmq penso che non ti servano le linee con l'anchor

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>tutorial</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<STYLE type=text/css>
BODY {
	SCROLLBAR-FACE-COLOR: black;
	SCROLLBAR-HIGHLIGHT-COLOR: orange;
	SCROLLBAR-SHADOW-COLOR: red;
	SCROLLBAR-3DLIGHT-COLOR: green;
	SCROLLBAR-ARROW-COLOR: #f373db;
	SCROLLBAR-TRACK-COLOR:  black;
	SCROLLBAR-DARKSHADOW-COLOR:black;
	background-color: black;
}

</style>
<script type="text/javascript">
	function PopUp(url, nome, width, height, scorrimento) {
	window.open(url, nome, 'width=' + width + ',height=' + height + ',scrollbars=' + scorrimento + ',resizable=no');
	}
</script>
<style type="text/css">
<!--
.Stile1 {color: #00FF00}
-->
</style>

<script type="text/javascript">

function dropdown(layer_id, anchor_id) {
var layer = document.getElementById(layer_id);
var anchor = document.getElementById(anchor_id);
if(layer.style.display == 'none') {
document.aprichiudi.src = 'tutorial_img/chiudi.gif';
layer.style.display = 'block';
//anchor.innerHTML = '[Chiudi Lista]';
} else if(layer.style.display == 'block') {
document.aprichiudi.src = 'tutorial_img/apri.gif';
layer.style.display = 'none';
//anchor.innerHTML = '[Apri Lista]';
}
}
      </script>

</head>
<body text="#FFFFFF" bgcolor="#000000">
<table border="0" cellpadding="0" cellspacing="0" align="center" width="450">
  <tr>

    <td align="center">
      
    </td>
  </tr>
</table>
<div align="center">

<table width="352" height="35" cellspacing="0" style="border-collapse:collapse" cellpadding="0" background="tutorial_img/batik01.jpg">
<tr>
<td align="left" class="tblack2" valign="top" width="408">
[img]tutorial_img/testata_p.gif[/img]<a href="javascript:dropdown('layer_Photoshop', 'anchor_Photoshop');">
[img]tutorial_img/apri.gif[/img]</a><div id="layer_Photoshop" style="display: none; width:399; height:189">
<table border="0" cellpadding="4" cellspacing="5" width="100%">

<td align="LEFT" class="box_completo">


TUTORIAL 1</p>


TUTORIAL 2</p>


TUTORIAL 3</p>


TUTORIAL 4</p>


TUTORIAL 5

</p>
</div></td>
</tr>
</table>


</body>
</html>

è importante che lo script sia messo nell'head perché senno non riesce a modificare le immaggini

dunque partendo dal tuo codice ho fatto le seguenti:

1. spostato lo script nella head
2. aggiunto le righe che ti ho segnato in grassetto nello script
3. aggiunto il tag nome all'immaggine che deve cmabiare perchè senno non la puoi modificare dal javascript
4. commentato le anchor per vedere se accadevano errori senza

Ovviamente puoi modificarti i nomi e tutto il resto

**Mr_Photoshop** · 17-02-2007, 17:05

Grazie Mille ,ho provato a copiare/incollare questo codice ma non va!!!!

**Kea BD** · 17-02-2007, 18:48

Originariamente inviato da Mr_Photoshop
Grazie Mille ,ho provato a copiare/incollare questo codice ma non va!!!!

Non va? Strano, è il codice che ho provato io e sul mio pc va, forse ho fatto involontariamente qualche modifica mentre lo incollavo...

Ho appena provato,ho tolto il trattino in

codice:

<a href="javascript:dropdown('layer_Photoshop', 'anchor_Photoshop');">

modifica al messaggio

non capisco perché ma il box di codice mi mette il trattino in javascript (java-script) senza che prima ci fosse.

Togli il trattino dopo che hai fatto copia incolla dal primo codice che ti ho dato

**Mr_Photoshop** · 18-02-2007, 00:04

Ok Funziona !!!! Grazie Mille !!!!!!

**Kea BD** · 18-02-2007, 00:08

Di niente, però vorrei capire perché il tag [code] mi alteri quello che scrivo, se l'esempio fosse stato + complesso avrei potuto perdere un bel po' di tempo a capire cosa non andava...

Discussione: Aprire/chiudere Finestre con img

Strumenti discussione

Ricerca discussione

Visualizza

Aprire/chiudere Finestre con img

Permessi di invio