Zurück   Flashforum > Flash und Server > PHP und MySQL
Hilfe: navigation included - wie kann man den aktiven menüpunkt highlighten? Hilfe: navigation included - wie kann man den aktiven menüpunkt highlighten?
Registrieren Hilfe Alle Foren als gelesen markieren

Antwort
Seite 1 von 2 1 2
 
LinkBack Themen-Optionen Ansicht
Alt 30-01-2010, 01:30   #1 (permalink)
Neuer User
 
Benutzerbild von nea23reloaded
 
Registriert seit: May 2006
Beiträge: 8
Question Hilfe: navigation included - wie kann man den aktiven menüpunkt highlighten?
Hallo liebe Programmierer

Ich bin neu hier und außerdem Anfängerin (kann kein PHP und JavaScript...) und habe mit viel Glück und einzelnen Code-Fragmenten eine Seite zurechtgebastelt die schon ganz gut funktioniert , ABER

ich wollte die Navi auslagern, weil ich ganz viele Seiten habe (und wenn ich da mal was ändern muss....) also habe ich das mit PHP include gemacht (eine navi.php)... und die inhalte der Seite lade ich mit einer get.js datei in einen dafür vorgesehenen DIV container in meiner index.php, weil ich die seite nicht neu laden möchte (ich habe einen sound und eine animation die ständig und flüssig laufen sollen), und das klappt alles, NUR

wie kann ich jetzt der navi.php sagen welcher inhalt in meiner DIV steht, damit ich dem "aktiven" link das richtige aussehen zuweisen kann? man weiss ja sonst nicht wo man grade ist...
das ist auch nicht so gut für die Usability, oder

Dachte das kann man vielleicht über irgendein Skript lösen, das ständig abfragt was in meine DIV reingeladen wurde, und die info dann an die navi.php schickt, damit der gedrückte link eine andere farbe kriegt oder so???

ich kenn mich einfach zu wenig aus mit programmieren. vielleicht geht das ganze auch leichter zu lösen?

bin wirklich für jeden Hinweis dankbar!!!

Achso hier ein paar ansichten aus meiner Seite

meine navi.php
Code:
	<ul id="mainnavi">
		<li>
			<a href="javascript: void(0);" onclick="getHome();" class="n1" >&nbsp;</a>
		</li>
		<li>
			<a href="javascript: void(0);" onclick="getUeberMich();" class="n2" >&nbsp;</a>
		</li>
		<li>
			<a href="javascript: void(0);" onclick="getHobbys();" class="n3" >&nbsp;</a>
		</li>
		<li>
			<a href="javascript: void(0);" onclick="getKontakt();" class="n4" >&nbsp;</a>
		</li>
    </ul>

in der get.js steht
Code:
            function getKontakt(){
                new Ajax.Request('kontakt.php', {
                    method: 'get',
                    onSuccess: getHTMLSuccess,
                    onFailure: getHTMLFailure
                });
            }
	
// usw.
            
            function getHTMLSuccess(originalRequest){
                var response = originalRequest.responseText;
                $('content').innerHTML = response;
            }
            
            function getHTMLFailure(){
                alert('Diese Seite steckt noch in der Entwicklung: Bitte versuchen Sie es später noch einmal.');
            }
            
            function clearNode(node){
                $(node).innerHTML = "";
                $(node).innerHTML = "";
            }

LG, nea23
nea23reloaded ist offline   Mit Zitat antworten
Alt 30-01-2010, 10:26   #2 (permalink)
Inventar
 
Benutzerbild von Nightflyer
 
Registriert seit: Jul 2002
Beiträge: 6.882
HTML-Code:
<?php
error_reporting( E_ALL ); 
?>
<!-- kommt in den head-bereich -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

    $(document).ready( function(){
        
        $('#mainnavi li a').click( function(){
            
            $('#content').load( this.attr('href') );
            
            $('#mainnavi li').css({ backgroundColor : 'none' });
            $(this).parent().css({ backgroundColor : '#FF0000' });
            
            return false;
            
        });
            
    })

</script>

<!-- kommt in den body-bereich -->

<ul id="mainnavi">
		<li>
			<a href="home.php" class="n1" >&nbsp;</a>
		</li>
		<li>
			<a href="uebermich.php" class="n2" >&nbsp;</a>
		</li>
		<li>
			<a href="hobbys.php" class="n3" >&nbsp;</a>
		</li>
		<li>
			<a href="kontakt.php" class="n4" >&nbsp;</a>
		</li>
</ul>
__________________
(\__/)
(='.'=)
(")_(")
Nightflyer ist offline   Mit Zitat antworten
Alt 30-01-2010, 11:08   #3 (permalink)
Neuer User
 
Benutzerbild von nea23reloaded
 
Registriert seit: May 2006
Beiträge: 8
Question
Hi Nightflyer

Danke für deinen Tipp! aber irgendwie funktioniert es nicht
vielleicht mache ich ja was falsch??

in meiner head.php steht jetzt
Code:
<?php
error_reporting( E_ALL ); 
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title></title>
	<link rel="stylesheet" type="text/css" href="media/css/style.css" />
	<link rel="stylesheet" type="text/css" href="media/css/slider.css" />
	<script type="text/javascript" src="media/js/prototype-1.6.0.2.js"></script>
	<script type="text/javascript" src="media/js/get.js"></script>
	<script type="text/javascript" src="media/js/show.js"></script>
    
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

    $(document).ready( function(){
        
        $('#mainnavi li a').click( function(){
            
            $('#content').load( this.attr('href') );
            
            $('#mainnavi li').css({ background-image: url(../pic/slice.png) });
            $(this).parent().css({ background-image: url(../pic/slice-act.png) });
            
            return false;
            
        });
            
    })

</script>
</head>
ich habe lediglich das css so angepasst wie ich es brauche... das kann ja nicht der grund sein, oder?

dann habe ich es getestet und hatte gar keine seiteninhalte mehr. eigentlich habe ich in der index.php im body-tag noch onLoad="getNews();", so dass er über die get.js sofort meine news.html Seite reinlädt, aber das passiert nicht mehr.

Dann habe ich gesehen das du in der navi.php die links geändert hast. das habe ich dann auch gemacht, aber jetzt tut sich garnichts mehr

Hilfe!
LG, nea
Geändert von nea23reloaded (30-01-2010 um 11:11 Uhr)
nea23reloaded ist offline   Mit Zitat antworten
Alt 30-01-2010, 11:58   #4 (permalink)
Inventar
 
Benutzerbild von Nightflyer
 
Registriert seit: Jul 2002
Beiträge: 6.882
dein url() muss in Anführungszeichen

https://addons.mozilla.org/de/firefox/addon/1843
__________________
(\__/)
(='.'=)
(")_(")
Nightflyer ist offline   Mit Zitat antworten
Alt 30-01-2010, 12:49   #5 (permalink)
Neuer User
 
Benutzerbild von nea23reloaded
 
Registriert seit: May 2006
Beiträge: 8
Question
Hi Nightflyer!

Hab das url() in Anführungszeichen gesetzt, aber es geht trotzdem nichts mehr

head.php
Code:
<?php
error_reporting( E_ALL ); 
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title></title>
	<link rel="stylesheet" type="text/css" href="media/css/style.css" />
	<link rel="stylesheet" type="text/css" href="media/css/arbeiten.css" />
	<link rel="stylesheet" type="text/css" href="media/css/slider.css" />
	<script type="text/javascript" src="media/js/prototype-1.6.0.2.js"></script>
	<script type="text/javascript" src="media/js/get.js"></script>
	<script type="text/javascript" src="media/js/show.js"></script>
    
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

    $(document).ready( function(){
        
        $('#mainnavi li a').click( function(){
            
            $('#content').load( this.attr('href') );
            
            $('#mainnavi li').css({ background-image: 'url(../pic/slice.png)' });
            $(this).parent().css({ background-image: 'url(../pic/slice-act.png)' });
            
            return false;
            
        });
            
    })

</script>
</head>
LG, nea
nea23reloaded ist offline   Mit Zitat antworten
Alt 30-01-2010, 14:20   #6 (permalink)
Inventar
 
Benutzerbild von Nightflyer
 
Registriert seit: Jul 2002
Beiträge: 6.882
HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title></title>
	<link rel="stylesheet" type="text/css" href="media/css/style.css" />
	<link rel="stylesheet" type="text/css" href="media/css/arbeiten.css" />
	<link rel="stylesheet" type="text/css" href="media/css/slider.css" />
	<script type="text/javascript" src="media/js/prototype-1.6.0.2.js"></script>
	<script type="text/javascript" src="media/js/get.js"></script>
	<script type="text/javascript" src="media/js/show.js"></script>
    
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

    $(document).ready( function(){
        
        $('#mainnavi li a').click( function(e){
            
            e.preventDefault()
            $('#content').load( $(this).attr('href') );
            
            $('#mainnavi li').css({ backgroundImage: 'url(../pic/slice.png)' });
            $(this).parent().css({ backgrounsdImage: 'url(../pic/slice-act.png)' });
            
        });
            
    })

</script>
</head>
<body>

<ul id="mainnavi">
		<li>
			<a href="home.php" class="n1" >&nbsp; Home</a>
		</li>
		<li>
			<a href="uebermich.php" class="n2" >&nbsp; Übermich</a>
		</li>
		<li>
			<a href="hobbys.php" class="n3" >&nbsp; Hobbys</a>
		</li>
		<li>
			<a href="kontakt.php" class="n4" >&nbsp; Kontakt</a>
		</li>
</ul> 

<div id="content" style="width:300px;height:300px;">Hallo</div>

</body>
</html>
So müsste es jetzt aber gehen.
1.) background-image wird in Javascript zu backgroundImage
2.) Default Klick-Event unterdrücken
3.) this.attr() nach $(this).attr() korrigiert
__________________
(\__/)
(='.'=)
(")_(")
Nightflyer ist offline   Mit Zitat antworten
Alt 30-01-2010, 14:53   #7 (permalink)
Neuer User
 
Benutzerbild von nea23reloaded
 
Registriert seit: May 2006
Beiträge: 8
Hi Nightflyer!

Danke für deine schnelle Reaktion jetzt funktioniert die halbe Navigation wieder... aber die zustände ändern sich immernoch nicht. Hab ich da noch irgendwas falsch?

head.php
HTML-Code:
<?php
error_reporting( E_ALL ); 
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title></title>
	<link rel="stylesheet" type="text/css" href="media/css/style.css" />
	<link rel="stylesheet" type="text/css" href="media/css/arbeiten.css" />
	<link rel="stylesheet" type="text/css" href="media/css/slider.css" />
	<script type="text/javascript" src="media/js/prototype-1.6.0.2.js"></script>
	<script type="text/javascript" src="media/js/get.js"></script>
	<script type="text/javascript" src="media/js/show.js"></script>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

    $(document).ready( function(){
        
        $('#mainnavi li a').click( function(e){
            
            e.preventDefault()
            $('#content').load( $(this).attr('href') );
            
            $('#mainnavi li').css({ backgroundImage: 'url(../pic/slice.png)' });
            $(this).parent().css({ backgroundImage: 'url(../pic/slice-act.png)' });
            
        });
            
    })

</script>
</head>
und: meinen <body onLoad="getNews();"> ignoriert er noch - ich habe auch noch einen anderen link für das impressum in der navi.php der logischerweise auch nicht mehr funktioniert...

HTML-Code:
<ul id="submenue">
<li>
	<a href="impressum.php" ></a>
</li>
</ul>

...

<ul id="mainnavi">

...
im css steht
HTML-Code:
...

#submenue {
		position:absolute;
		left:47px; 
		top:-5px; 
		width:50px; 
		height:25px;
		margin: 0;
		padding:0;
		list-style-type: none;
}
				
/* Normalzustand Link Impressum */

ul#submenue li a {
		width: 74px;
		height: 25px;
		display: block;
		background: url(../pic/impressum.png) right;
		background-positon: left;	
}
				
ul#submenue li a:hover {
		background: url(../pic/impressum_ov.png) right;
}
				
...
wie kann ich die zwei wieder einbinden?

Danke für deine Hilfe!!!
LG, nea
nea23reloaded ist offline   Mit Zitat antworten
Alt 30-01-2010, 22:53   #8 (permalink)
Inventar
 
Benutzerbild von Nightflyer
 
Registriert seit: Jul 2002
Beiträge: 6.882
Scheint noch viele kleine Baustellen zu geben. Wie wärs wenn du all deine Dateien in ein zip/rar packst und sie hochlädst oder sie mir per PM schickst?

Weil so mit Codefetzen deinen Salat zu korrigieren ist schwierig
__________________
(\__/)
(='.'=)
(")_(")
Nightflyer ist offline   Mit Zitat antworten
Alt 31-01-2010, 09:01   #9 (permalink)
Neuer User
 
Benutzerbild von nea23reloaded
 
Registriert seit: May 2006
Beiträge: 8
Danke Nightflyer echt lieb von dir!
ich komm da auch einfach nicht mehr weiter ohne Hilfe...

internet.zip

LG, nea
nea23reloaded ist offline   Mit Zitat antworten
Alt 31-01-2010, 15:39   #10 (permalink)
Inventar
 
Benutzerbild von Nightflyer
 
Registriert seit: Jul 2002
Beiträge: 6.882
Dank Rapidshare konnte ich es immer noch nicht downloaden..
__________________
(\__/)
(='.'=)
(")_(")
Nightflyer ist offline   Mit Zitat antworten
Alt 31-01-2010, 15:52   #11 (permalink)
Neuer User
 
Benutzerbild von nea23reloaded
 
Registriert seit: May 2006
Beiträge: 8
...war zu groß für hier... hast Du eine andere Idee?

LG nea
nea23reloaded ist offline   Mit Zitat antworten
Alt 31-01-2010, 19:36   #12 (permalink)
Inventar
 
Benutzerbild von Nightflyer
 
Registriert seit: Jul 2002
Beiträge: 6.882
Schicks mir per Mail nightflyerx(_AT_)bluemail.ch
__________________
(\__/)
(='.'=)
(")_(")
Nightflyer ist offline   Mit Zitat antworten
Alt 31-01-2010, 20:45   #13 (permalink)
Neuer User
 
Benutzerbild von nea23reloaded
 
Registriert seit: May 2006
Beiträge: 8
Hi Nichtflyer

Ich danke dir für die mühe! du findest die gezippten dateien jetzt in deinem mailpostfach.

freu mich schon von dir zu hören
danke und bis bald, nea
nea23reloaded ist offline   Mit Zitat antworten
Alt 31-01-2010, 21:35   #14 (permalink)
Inventar
 
Benutzerbild von Nightflyer
 
Registriert seit: Jul 2002
Beiträge: 6.882
Mail zurück, hoffe du bist zufrieden
__________________
(\__/)
(='.'=)
(")_(")
Nightflyer ist offline   Mit Zitat antworten
Alt 01-02-2010, 19:58   #15 (permalink)
Neuer User
 
Benutzerbild von nea23reloaded
 
Registriert seit: May 2006
Beiträge: 8
Thumbs up
WW!! Super, vielen lieben dank nightflyer
nea23reloaded ist offline   Mit Zitat antworten
Antwort
Seite 1 von 2 1 2

Lesezeichen

Stichworte
aktiv, highlighten, included, navigation

« Vorheriges Thema | Nächstes Thema »
Themen-Optionen
Ansicht
Linear-Darstellung Linear-Darstellung

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.
BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks sind an
Pingbacks sind an
Refbacks sind an

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Air Framnework Included // Link? gio*lemon Adobe AIR 2 30-07-2007 18:55
Aktiven Menüpunkt anzeigen below Flash Einsteiger 1 16-12-2006 14:59
Textfeld highlighten mr_groove Flash Einsteiger 3 17-03-2006 08:57
Strings highlighten Wulfie PHP und MySQL 4 05-06-2004 07:28
Variabeln aus included as zu importierbares txt? genesys ActionScript 1 15 11-02-2004 17:54


Alle Zeitangaben in WEZ +1. Es ist jetzt 14:16 Uhr.

Domains, Webhosting & Vserver von Host Europe
Unterstützt das Flashforum!
Adobe User Group

Kontakt - Impressum - Flashforum - Archiv - Datenschutzerklärung - Nach oben

Copyright ©1999 – 2012 Marc Thiele