1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

How to highlight cells in one table as matching cells in another table are highlighted

Discussion in 'JavaScript' started by Fred 777, Jul 23, 2019.

  1. #1
    I have two tables in an html document <table id="table1"> and <table id="table2">.
    There are 10 columns and 5 rows in each table.
    Each cell contains either one or two alphanumeric or special (e.g. *, $, % etc) characters.

    I would like it to function as follows:

    When I hover or select a cell (on a specific row - e.g. top row) of table1, e.g. containing the "Z" character, then the "Z" character will be highlighted /selected on table2 if it appears on the same specific row (i.e. top row of table2).
    This should work in reverse (i.e. hovering /selecting table2 cell causes table1 cell to highlight /select)
    Only one cell at a time on each row can be highlighted /selected.
    Rows can be independently controlled (i.e. without affecting any other row's cell highlighting).
    With a second click the highlight should be removed.

    Can this be done with CSS or JavaScript? (CSS preferred) but both useful.

    Many thanks in advance for your kind help.

    Fred 777, Jul 23, 2019 IP