6 berichten aan het bekijken - 1 tot 6 (van in totaal 6)
  • Q:

    Moderator
    Night

    [Opgelost] WordPress / TablePress fading alleen bij bepaalde tabel

    Ik gebruik TablePress voor tabellen op een WordPress website. In een bepaalde table staan afbeeldingen, die bij een mouse-over van grijs naar kleur moeten veranderen. Dat lukt prima. Nu heb ik echter gemerkt dat dit effect ook op andere pagina’s (zonder tabellen maar wel met kolommen en foto’s) voorkomt. Ik wil de CSS van TablePress dan ook alleen op een bepaalde tabel van toepassing laten zijn. Ik weeet dat je met Table ID’s zaken per tabel kan regelen. Alleen de fading lukt me niet.

    Hoe doe ik dat?

     

    CSS:

     

    img {
    -webkit-filter: grayscale(100%);
    -webkit-transition: .5s ease-in-out;
    -moz-filter: grayscale(100%);
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    }

    img:hover {
    -webkit-filter: grayscale(0%);
    -webkit-transition: .5s ease-in-out;
    -moz-filter: grayscale(0%);
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    }

    .tablepress-id-2 .column-1,
    .tablepress-id-2 .column-2,
    .tablepress-id-2 .column-3,
    .tablepress-id-2 .column-4,
    .tablepress-id-2 .column-5,
    .tablepress-id-2 .column-6,
    .tablepress-id-2 .column-7,
    .tablepress-id-2 .column-8,
    .tablepress-id-2 .column-9,
    .tablepress-id-2 .column-10 {
    width: 14.285705%;
    }

    .tablepress-id-3 .column-1 {
    width: 33%;
    }

    .tablepress-id-3 .column-2 {
    width: 67%;
    }

    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 3 weken, 3 dagen geleden door  Night.
    • Dit onderwerp is gewijzigd 1 week, 1 dag geleden door  Night. Reden: Topic opgelost

    Bijdrager
    EagerB0bNerd

    Beetje lastig te zeggen zonder je HTML, weet ook niet of ik de vraag helemaal begrijp, maar ik zou zeggen zoiets:

    .tablepress-id-2 img {
    -webkit-filter: grayscale(100%);
    -webkit-transition: .5s ease-in-out;
    -moz-filter: grayscale(100%);
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    }

    .tablepress-id-2 img:hover {
    -webkit-filter: grayscale(0%);
    -webkit-transition: .5s ease-in-out;
    -moz-filter: grayscale(0%);
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    }

    voor images in tabel met classname “tablepress-id-2”

     


    Bijdrager
    Joid

    Zoiets inderdaad. Of voeg de page-id aan de CSS, als je alleen je CSS op één specifieke pagina terug wilt zien.


    Moderator
    Night

    De optie van EagerB0bNerd schijnt prima te werken. Thnx.


    Bijdrager
    Shmoo

    Ik zie alleen nog geen tabelletjes in jouw bijdrages op de homepage.. 🙂

     


    Moderator
    Night

    Het betreft ook niet deze site (gelukkig) 😰

6 berichten aan het bekijken - 1 tot 6 (van in totaal 6)

Je moet ingelogd zijn om een reactie op dit onderwerp te kunnen geven.