[CSS]Stijl alleen toepassen op bestanden uit één folder

Pagina: 1
Acties:

  • sjaakaq
  • Registratie: September 2003
  • Laatst online: 17-04 10:24

sjaakaq

It might get loud

Topicstarter
Ik zit met een probleempje: ik heb een weblog, waarop dus af en toe plaatjes staan. Ook schrijf ik CD reviews die ik op dat log zet. De plaatjes hiervoor (CD covers enz.) staan allemaal in een map (cd_reviews). Nu wil ik alleen die plaatjes een border geven. Nu weet ik dat zoiets met een id kan, maar dan moet ik al die plaatjes nu nog een id gaan geven (hebben ze namelijk niet), en dit ook uitleggen aan een minder-css-begaafde medelogger. Dus is mijn vraag: is er een methode in CSS om een stijl alleen toe te passen op items uit één bepaalde map?

Zoeken op google naar "css only apply certain folder" leverde niets op.
Zoeken op Got naar "css één map" leverde ook niets op.

leoaq.fm // Jeune Loop


  • dominic
  • Registratie: Juli 2000
  • Laatst online: 08-02 14:55

dominic

will code for food

Je kan in Javascript de img een border even afhankelijk van de string waarde die in de src property staat.

Wat me natuurlijk makkelijker lijkt is om gewoon netjes een aparte class aan te maken voor die afbeeldingen en het netjes in je HTML door te geven.

Download my music on SoundCloud


  • sjaakaq
  • Registratie: September 2003
  • Laatst online: 17-04 10:24

sjaakaq

It might get loud

Topicstarter
idd...maar dan moet ik:
1-een helehoop plaatjes nu nog een class geven
2-een non-css kenner (computeranalfabeet) gaan uitleggen dat ie als ie een cd review typt, de img tag een "class="lalala" moet meegevan...wat gegarandeerd misgaat.

leoaq.fm // Jeune Loop


  • Genoil
  • Registratie: Maart 2000
  • Laatst online: 12-11-2023
allereerst, wat jij precies wilt kan niet met CSS.
Maar, ik ga er voor het gemak maar even vanuit dat "mijnogen.net" uit je sig de betreffende blog pagina is. Om alle blogentries zit een DIV met class="content". Je kunt nu alle IMG elementen binnen die DIV een border te geven door de volgende CSS regel:

Cascading Stylesheet:
1
2
3
div.content img {
    border: 1px solid #000;
}

  • sjaakaq
  • Registratie: September 2003
  • Laatst online: 17-04 10:24

sjaakaq

It might get loud

Topicstarter
Dat weet ik ;) Echter: ik wil alleen de cd covers een randje geven, en binnen content staan ook nog andere soorten plaatjes, die GEEN border moeten krijgen.
Dit kan dus niet met CSS. Is javascript een geschikte kandidaat?

leoaq.fm // Jeune Loop


  • We Are Borg
  • Registratie: April 2000
  • Laatst online: 22:01

We Are Borg

Moderator Wonen & Mobiliteit / General Chat
Ik weet niet hoe het plaatsen van plaatjes gebeurd, maar kan je niet zorgen dat de cd cover apart wordt opgegeven bij het laatsen? Dan kan je namelijk het idee van Genoil toepassen wat imo beter is dan JS :)

  • sjaakaq
  • Registratie: September 2003
  • Laatst online: 17-04 10:24

sjaakaq

It might get loud

Topicstarter
De CD cover wordt gewoon via <img> ingevoerd :)

Maarre wat ik wil kan dus gewoon niet?

leoaq.fm // Jeune Loop


  • Switch
  • Registratie: December 2001
  • Laatst online: 15-03 07:50
Volgens mij niet :) Maar wat is er zo moeilijk aan het toeveogen van een class=cd in een img tag? Weet niet hoeveel reviews je hebt, maar een beetje copy-paster werkt zich er vast wel doorheen binnen een uur.

  • Genoil
  • Registratie: Maart 2000
  • Laatst online: 12-11-2023
mja javascript...kan wel natuurlijk...fraai? NEE!

ff uit het hoofd hoor
JavaScript:
1
2
3
4
5
6
7
8
9
var c = document.getElementById('content');
var images = c.getElementsByTagName("img");
for(var i = 0; i<images.length();i++) {
    img = images[i];
    if(img.src.match("/\/cd_reviews\//")) {
        img.style.border = "1 px solid #000";
        // of: img.className = "cdreview";
    }
}

  • JayVee
  • Registratie: Mei 2002
  • Laatst online: 14-11-2025

JayVee

shibby++!

Cascading Stylesheet:
1
img.cdcover { border: 1px solid gray; }
:?
Op een bepaalde map kan volgens mij gewoon niet.

ASCII stupid question, get a stupid ANSI!


  • sjaakaq
  • Registratie: September 2003
  • Laatst online: 17-04 10:24

sjaakaq

It might get loud

Topicstarter
Hmmm dan maar alle images een border.

OK, weer een beetje wijzer.

leoaq.fm // Jeune Loop


  • crisp
  • Registratie: Februari 2000
  • Nu online

crisp

Devver

Pixelated

leokennis schreef op zondag 12 december 2004 @ 11:27:
De CD cover wordt gewoon via <img> ingevoerd :)

Maarre wat ik wil kan dus gewoon niet?

Dan kan je toch bij het verwerken van de invoer de src property checken en er alsnog een class aan toekennen?

[ Voor 3% gewijzigd door crisp op 12-12-2004 12:09 ]

Intentionally left blank


  • Folkert
  • Registratie: September 2001
  • Laatst online: 18:54
Je werkt met php dus dan kan je het toch makkelijk oplossen met een replace...

gebruk iets van replace(strBody, "<img src="../../cd_reviews/", "<img class='imgClass' src=''../../cd_reviews/")...

ofzoiets. ik ben geen php-er maar een vb-er ;)

Ervan uitgaande dat de items uit een database komen en de image in hetzelfde veld staat als de content zelf....

[ Voor 40% gewijzigd door Folkert op 12-12-2004 12:25 ]


  • -Lars-
  • Registratie: Mei 2004
  • Niet online
Cascading Stylesheet:
1
2
3
4
5
/* Rand om cd-covers */
img[src~="/mapnaam_van_map_met_cd_covers/"]
{
    border: 1px solid #000000;
}

Of in pseudo-code: Pas "border: 1px solid #000000;" toe op "img"-elementen waarvan het atribuut "src" het volgende bevat "/mapnaam_van_map_met_cd_covers/".

Ik kan het trouwens fout hebben (ik ben me nog maar net aan het verdiepen in het betere CSS knutselwerk). Of is het niet mogelijk omdat /mapnaam_van_map_met_cd_covers/ niet gegarandeerd voorkomt in het src-atribuut.

edit:
Bovenstaande code klopt niet! Check even Anne's bericht.
Overzicht van selectors: http://www.w3.org/TR/2001...ctors-20011113/#selectors
Ook zal het niet werken in MSIE, zoals Anne al aangeeft.

[ Voor 24% gewijzigd door -Lars- op 12-12-2004 13:20 ]


Verwijderd

Je wilt 'img[src*=foo]' als selector gebruiken. Niet 'img[src~=foo]'. Los van het feit dat het waarschijnlijk ook in IE moet werken en je dus toch met een CLASS te werk moet gaan. (Lijkt me nog niet moeilijk om met PHP een dergelijke check te doen en dan de CLASS toe te voegen.

  • roytanck
  • Registratie: Oktober 1999
  • Laatst online: 12-05 15:11
Attribute selectors worden toch alleen door Mozilla ondersteund nog? Dit is natuurlijk de oplossing (evt. met ^=), maar pratisch toepasbaar lijkt 'ie me niet....

  • sjaakaq
  • Registratie: September 2003
  • Laatst online: 17-04 10:24

sjaakaq

It might get loud

Topicstarter
Conclusie:
1-Het kan waarschijnlijk over een paar jaar als Firefox de no.1 browser is
2-Het kan als de items in een database staan, wat niet het geval is
3-Het kan met JS maar voor die oplossing was het al te laat :)

Oftewel een poldermodeloplossing: om de "css-niet kenner" én de "het moet er wel een beetje mooi uitziener" allebei wat te geven, alles een border :)

Toch tnx voor de respons en oplossingen e.d., altijd goed voor de search!

leoaq.fm // Jeune Loop


  • Folkert
  • Registratie: September 2001
  • Laatst online: 18:54
Je zegt dat de items niet uit een database komen maar ik zie dat alle items een ID hebben .... mag ik vragen hoe jou site dan is opgebouwd???
Pagina: 1