immagini <li>

**wallrider** · 15-09-2005, 12:08

vorrei realizzare ciò che segue
in una lista <ul>[*] le righe pari avranno un'immagine e le righe dispari ne avranno un'altra

si può fare?

SBIZZARRITEVI

**pierofix** · 15-09-2005, 12:10

Io creerei due classi ("pari" e "dispari") e le attribuirei di conseguenza. Le immagini, ovviamente, le inserirai come sfondo.

Un po' stupido e macchinoso, ma non saprei come altro fare.

**wallrider** · 15-09-2005, 12:24

ci ho già provato, ma non funziona

codice:

<html>
	<head>
		<title>Gestione Potazioni</title>
		<link rel="stylesheet" href="../../style.css">
		<script type="text/javascript">
			function loadFilteredPage(caller){
				var f1=document.forms['form1']
				var sUff=f1.fUff
				if (sUff.selectedIndex >0){
					if(caller=='tp'){
						if(f1.fTiPost.selectedIndex>0){
							f1.submit()
						}else{
							alert('Selezionare tipo postazione')
							f1.fTiPost.focus()
						}
					}else{
						f1.submit()
					}
				}else{
					//alert('Selezionare Ufficio')
					//sUff.focus()
				}
			}
		</script>
		<style>
			ul li.p0{list-style-image: url(../../imgs/person1.gif)
			ul li.p1{list-style-image: url(../../imgs/person2.gif)
		</style>
	</head>
	<body>
<!--
fUff:24
fTiPost:1

-->
		<div style="text-align:center;font-size:18">
			Gestione postazioni
		</div>
		<form name="form1" action="index.asp" method="post">
			Filtra in base a:

			Ufficio:
			<select name="fUff" onchange="loadFilteredPage('u')">
				<option value="-1">Scegliere ufficio</option>
				<option value="0">- Nessun ufficio</option>
<option value="12">Ambiente</option>
<option value="19">Anagrafe</option>
<option value="15">Asilo nido</option>
<option value="20">Biblioteca</option>
<option value="16">Casa di riposo</option>
<option value="24" SELECTED>CED</option>
<option value="7">Cultura</option>
<option value="2">Economato</option>
<option value="5">ICI</option>
<option value="10">Lavori pubblici</option>
<option value="18">Organi Istituzionali</option>
<option value="13">Personale</option>
<option value="4">Politiche sociali</option>
<option value="14">Polizia Municipale</option>
<option value="1">Ragioneria</option>
<option value="8">Scuola</option>
<option value="3">Segreteria</option>
<option value="9">Sport</option>
<option value="6">Tributi</option>
<option value="11">Urbanistica</option>

			</select>
			
[img]../../imgs/rArrow.png[/img]
Tipo postazione:<select name="fTiPost" onchange="loadFilteredPage('tp')">
		<option value="-1">Scegliere tipo postazione</option>
<option value="3">Personal Computer</option>
<option value="1" selected>Terminale WBT</option>
</select>

Numero di postazioni trovate:1
<ul style="list-style-image: url(../../imgs/WBT.gif);height:32;width:auto">[*]WBT20
Utilizzatori Abituali
<ul>
<li class="p0">wallrider[/list][/list]
		</form>

	</body>
</html>

Accanto a wallrider c'è un cerchio, non l'immagine
PS:Scusa la pessima indentazione ma è generata tramite ASP

**andrea.paiola** · 15-09-2005, 12:26

mi ricordo un thread simile di un po' di mesi fa... fai una ricerca con "celle alternate", "righe alternate" o simili

**pierofix** · 15-09-2005, 12:26

Prova a mettere i ";" (punto e virgola) alla fine delle istruzioni CSS e ad aggiungere al tag <style> l'attributo type="text/css".

Let me know.

**wallrider** · 15-09-2005, 12:37

più che i punti e virgola alla fine delle istruzioni css ci dovevo mettere il "}"

Grazie a tutti

**wallrider** · 15-09-2005, 12:46

adesso non mi visualizza + quello che veniva visualizzato prima

codice:

<html>
	<head>
		<title>Gestione Potazioni</title>
		<link rel="stylesheet" href="../../style.css">
		<script type="text/javascript">
			function loadFilteredPage(caller){
				var f1=document.forms['form1']
				var sUff=f1.fUff
				if (sUff.selectedIndex >0){
					if(caller=='tp'){
						if(f1.fTiPost.selectedIndex>0){
							f1.submit()
						}else{
							alert('Selezionare tipo postazione')
							f1.fTiPost.focus()
						}
					}else{
						f1.submit()
					}
				}else{
					//alert('Selezionare Ufficio')
					//sUff.focus()
				}
			}
		</script>
		<style type="text/css">
			ul li.p0{list-style-image: url(../../imgs/person1.gif)}
			ul li.p1{list-style-image: url(../../imgs/person2.gif)}
		</style>
	</head>
	<body>
<!--
fUff:0
fTiPost:1

-->
		<div style="text-align:center;font-size:18">
			Gestione postazioni
		</div>
		<form name="form1" action="index.asp" method="post">
			Filtra in base a:

			Ufficio:
			<select name="fUff" onchange="loadFilteredPage('u')">
				<option value="-1">Scegliere ufficio</option>
				<option value="0" SELECTED>- Nessun ufficio</option>
<option value="12">Ambiente</option>
<option value="19">Anagrafe</option>
<option value="15">Asilo nido</option>
<option value="20">Biblioteca</option>
<option value="16">Casa di riposo</option>
<option value="24">CED</option>
<option value="7">Cultura</option>
<option value="2">Economato</option>
<option value="5">ICI</option>
<option value="10">Lavori pubblici</option>
<option value="18">Organi Istituzionali</option>
<option value="13">Personale</option>
<option value="4">Politiche sociali</option>
<option value="14">Polizia Municipale</option>
<option value="1">Ragioneria</option>
<option value="8">Scuola</option>
<option value="3">Segreteria</option>
<option value="9">Sport</option>
<option value="6">Tributi</option>
<option value="11">Urbanistica</option>

			</select>
			
[img]../../imgs/rArrow.png[/img]
Tipo postazione:<select name="fTiPost" onchange="loadFilteredPage('tp')">
		<option value="-1">Scegliere tipo postazione</option>
<option value="3">Personal Computer</option>
<option value="4">Portatile</option>
<option value="2">Terminale AS400</option>
<option value="1" selected>Terminale WBT</option>
</select>

Numero di postazioni trovate:37
<ul style="list-style-image: url(../../imgs/WBT.gif);height:32;width:auto">[*]WBT01
[*]WBT02
[*]WBT03
[*]WBT03
[*]WBT04
[*]WBT05
[*]WBT06
[*]WBT07
[*]WBT08
[*]WBT09
[*]WBT10
[*]WBT11
[*]WBT12
[*]WBT13
[*]WBT14
[*]WBT15
[*]WBT15
[*]WBT16
[*]WBT17
[*]WBT18
[*]WBT19
[*]WBT22
[*]WBT23
[*]WBT24
[*]WBT25
[*]WBT26
[*]WBT26
[*]WBT26
[*]WBT27
[*]WBT28
[*]WBT29
[*]WBT30
[*]WBT31
[*]WBT32
[*]WBT33
[*]WTB34
[*]WBT35
[/list]

		</form>

	</body>
</html>

Discussione: immagini <li>

Strumenti discussione

Ricerca discussione

Visualizza

immagini <li>

risolto

Ferma tutto

Permessi di invio