[HTML/CSS/JS] Nieuwe links markeren

[Verwijderd]

Ik ben bezig met het maken van een nieuwe website. Een van de zaken die ik zou willen doen is nieuwe links opvallend aanduiden. Als de link "Foto's van de kat" een nieuwe link is voor de bezoeker, dan wil ik dat er naast die link "*nieuw*" komt te staan in het rood.

Met ASP.NET zou ik hier wel snel iets op vinden, maar ik heb dit keer niet de luxe om al die programmeertalen te kunnen gebruiken (de server ondersteund ze niet).

Op dit ogenblik heb ik het opgelost via CSS. Met a:visited en a:link slaag ik er in een deel tekst (*nieuw*) te tonen of te verbergen. Dat werkt goed zolang de history niet gedelete wordt. Eens de history gedelete wordt, staat alles terug als *nieuw* en dat is niet zo mooi.

Ik zoek dus een manier om dit beter te doen. Ik heb echter geen idee hoe ik het moet aanpakken. Het liefst zou ik het allemaal in HTML + CSS doen, dan kan ik de website op elke host plaatsen die ik wil. Javascript mag natuurlijk ook aangezien dit niets van de server vraagt. In het ergste geval kan ik PHP gebruiken, maar dat vermijd ik liever als het niet nodig is.

Wat lijkt jullie de beste oplossing voor dit probleem? (links zijn altijd welkom. Ik veronderstel dat het met cookies mogelijk moet zijn, maar ik weet niet hoe ik hier mee moet werken...En cookies intypen in Google gaat net iets te veel results geven)

[NMe]

Als je voorkeur uitgaat naar een clientside oplossing, dan zit je hier verkeerd. Waar hoort mijn topic?

Verder heeft elke oplossing die je gaat vinden met behulp van cookies vrijwel hetzelfde probleem als je CSS-oplossing die je nu gebruikt. Cookies weggooien betekent dat alles weer "nieuw" is.

PRG>>WEB

[user109731]

Met javascript cookies setten kan met document.cookie. Daar zou je dan bijv. in kunnen zetten wanneer de bezoeker voor het laatst actief was... Maar dit is zoals al gezegd ook niet erg betrouwbaar: cookies kunnen ook worden gewist. Server-side kan ook wel, maar is lastiger omdat je bijv meer gebruikers per ip kan hebben.

[Verwijderd]

Oei, even duidelijker zijn. Het is niet de bedoeling om een volledig waterdichte oplossing te maken. Ik zoek gewoon een "betere" oplossing. Het probleem met de history is dat die standaard al na 20 dagen gedelete wordt. De grootste computerleek zal dus na 20 dagen zijn history kwijt zijn en de "fout" al tegenkomen.
Het deleten van cookies gebeurt naar mijn weten niet automatisch. Je moet ze manueel deleten of via spyware-scanners etc. Dat het hele systeem "reset" als je je cookies delete, daar kan ik mee leven.

Het probleem dat ik heb met het werken met cookies is dat ik niet weet hoe. Ik snap dat ik ergens moet bijhouden wanneer het laatste bezoek was van een gebruiker, en dan kijken welke links "nieuwer" zijn...maar ik heb geen idee hoe ik dat moet aanpakken.

[Verwijderd]

Op http://www.quirksmode.org/js/cookies.html zou je volgens mij alles moeten kunnen lezen wat je moet weten.

[Verwijderd]

Ik heb de link volledig gelezen en ik denk dat ik het kan gebruiken. Maar...mijn javascript is niet zo schitterend en functioneert niet 100%. Het is dit stuk code

code:

if(relAttribute.toLowerCase().match('date')){
    var date = relAttribute.substring(5,13);
    anchor.onclick = createCookie(cookie,date,'');
    if(parseInt(relAttribute.substring(5,13)) == readCookie(cookie)){
        anchor.className = "old";
    }
    else{
        anchor.className = "new";
    }
}

De basis komt hierop neer:
Ik ga op zoek naar alle hyperlinks waar de "rel"-tag de tekst "date" bevat. Nadien ga ik de datum er uithalen (in de rel-tags staat iets in de vorm van rel="date[yyyymmdd]"). Vervolgens wil ik dan door de click-event de cookie aanmaken met die datum én een css-style toekennen op basis van de datum in de cookie.

Het probleem? Het werkt niet allemaal samen. Als ik enkel de

code:

anchor.onclick = createCookie(cookie,date,'');

in de if-lus plaats dan wordt de cookie goed aangemaakt. Als ik de 2e if-lus alleen gebruik dan wordt de css-style goed toegepast...maar als ze beide erin staan dan werkt niets meer. Kan iemand me helpen?

[Verwijderd]

Het bovenstaande probleem is al opgelost. Ik zit echter nog met 1 extra probleem.
De links die ik wil laten markeren ga ik in mijn HTML herkenbaar maken door de rel="date[yyymmdd]" tag te gebruiken.

Het is mijn bedoeling om via mijn script achter elke link waarin die rel-tag voorkomt, een div te plaatsen met daarin wat tekst. Probleem is dat ik niet "achter" de link raak. Ik heb zitten zoeken en ik vind enkel appendChild. Die functie kan ik echter niet gebruiken omdat ik dan nog steeds binnen de a-tag blijf, en ik er net buiten wil. Hoe kan ik javascript dit laten doen?

[Verwijderd]

Ondertussen heb ik ook al een mauw aan het bovenstaande probleem gepast en rest mij nog 1 probleem waar ik geen oplossing voor vind.
Ik heb het hele script in een aparte file gestopt. Nu wil ik graag dat dat script uitgevoerd wordt van zodra de pagina laad, maar zonder de <body onLoad=""> te gebruiken. Ik wil dus enkel de link leggen naar mijn script en niets extra's. Ik heb al veel scripts gezien die dit kunnen, maar ik slaag er zelf niet in om dit voor elkaar te krijgen.

[Zoefff]

JavaScript:

var a;
var newNode;

a.parentNode.insertBefore(newNode, a.nextSibling);

Als a je link is kan je op deze manier een nieuwe node toevoegen vlak voor het eerste element ná a. Zie ook http://www.quirksmode.org/dom/w3c_core.html

[user109731]

Verwijderd schreef op zaterdag 28 oktober 2006 @ 13:28:
Ik heb het hele script in een aparte file gestopt. Nu wil ik graag dat dat script uitgevoerd wordt van zodra de pagina laad, maar zonder de <body onLoad=""> te gebruiken. Ik wil dus enkel de link leggen naar mijn script en niets extra's. Ik heb al veel scripts gezien die dit kunnen, maar ik slaag er zelf niet in om dit voor elkaar te krijgen.

JavaScript:

window.onload = jouwFunctie;