Qt Assistant appears not to support hover

Perdrix

I have a help html file that I changed to use hover instead of mouseover.

    <style>
      a.anchor {
        text-decoration: underline;
        color: blue;
        margin-left: 1em;
        &:hover { cursor: pointer; }
      }
      .vertical {
        display: flex;
        flex-direction: column;
        max-width: 500px;
      }
      .column_for_image {
        background-size: 0;
        background-image: inherit;
        margin-left: 40px;
      }
      .container_for_image {
        width: 500px; 
        height: 500px;
        background-image: inherit;
        flex-shrink: 0;
        margin: 0px;
      }
      p.no_top_margin {
        margin-top: 0px;
      }

      div#stacking {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        background-size: 0;
        background-image:url('../images/Theory/Stack_1.jpg');
        --caption-text: "One light frame";
        &:has(#stack_2_images:hover) {
          background-image:url('../images/Theory/Stack_2.jpg');
          --caption-text: "Stack of two light frames";
        }
        &:has(#stack_4_images:hover) {
          background-image:url('../images/Theory/Stack_4.jpg');
          --caption-text: "Stack of four light frames";
        }
        &:has(#stack_16_images:hover) {
          background-image:url('../images/Theory/Stack_16.jpg');
          --caption-text: "Stack of 16 light frames";
        }
        &:has(#stack_32_images:hover) {
          background-image:url('../images/Theory/Stack_32.jpg');
          --caption-text: "Stack of 32 light frames";
        }
      }
      span#figure_caption {
        text-align: center;
      }
      span#figure_caption::after {
        content: var(--caption-text);
      }
    </style>

  </head>

and then used this code to display different images when the mouse was hovered over the text:

   <div id="stacking">
      <div class="vertical">
        <p>The example on the right shows the result of stacking a single image.</p>
        <p class="no_top_margin"> No calibration was done and some hot pixels are visible in some cases (no dark and bias subtraction, no flat division). </p>
        <span> Mouse over the text to see the result of the stack for </span>
        <a class="anchor" id="stack_1_image">1 image </a>
        <a class="anchor" id="stack_2_images">2 images </a>
        <a class="anchor" id="stack_4_images">4 images </a>
        <a class="anchor" id="stack_16_images">16 images </a>
        <a class="anchor" id="stack_32_images">32 images </a>
        <p>You can see that the resulting image is not lighter or more colorful when the number of stacked light frames is increasing but is much smoother. </p>
      </div>
      <div class="vertical column_for_image">
        <figure class="container_for_image">
        </figure>
        <span id="figure_caption">&ZeroWidthSpace;</span>
      </div>
    </div>

This works fine when I display it in Firefox. But Qt Assistant doesn't show the images :(
The .qhp file says:

    <files>
      <file>dss editing.mp4</file>
      <file>english/commandline.htm</file>
      <file>english/faq.htm</file>
      <file>english/live.htm</file>
      <file>english/technical.htm</file>
      <file>english/theory.htm</file>
      <file>english/userguide.htm</file>
      <file>images/bayerdrizzle.jpg</file>
      <file>images/bayerinterpolation.jpg</file>
      <file>images/bayersuperpixel.jpg</file>
      <file>images/drizzle.jpg</file>
      <file>images/edittoolbar.jpg</file>
      <file>images\english/batchstacking.jpg</file>
      <file>images\english/calibration_alternate1.jpg</file>
      <file>images\english/calibration_alternate2.jpg</file>
      <file>images\english/calibration_full.jpg</file>
      <file>images\english/comettab.jpg</file>
      <file>images\english/contextmenu.jpg</file>
      <file>images\english/cosmetictab.jpg</file>
      <file>images\english/createstarmask.jpg</file>
      <file>images\english/fitsddp.jpg</file>
      <file>images\english/live_main.jpg</file>
      <file>images\english/live_settings.jpg</file>
      <file>images\english/luminance.jpg</file>
      <file>images\english/mainscreen.jpg</file>
      <file>images\english/processingtab.jpg</file>
      <file>images\english/properties.jpg</file>
      <file>images\english/rawddp.jpg</file>
      <file>images\english/register_settings.jpg</file>
      <file>images\english/registeringstackingtab.jpg</file>
      <file>images\english/rgblevels.jpg</file>
      <file>images\english/saveoptions.jpg</file>
      <file>images\english/stackingalignment.jpg</file>
      <file>images\english/stackingfiles.jpg</file>
      <file>images\english/stackingmode.jpg</file>
      <file>images\english/stackingsettings.jpg</file>
      <file>images\english/stackingsteps.jpg</file>
      <file>images/fuzzycomet.jpg</file>
      <file>images/histogram.jpg</file>
      <file>images/m57_drizzle.jpg</file>
      <file>images/m57_nodrizzle.jpg</file>
      <file>images/previewrect.jpg</file>
      <file>images/starfreeze.jpg</file>
      <file>images/starmask_mask.jpg</file>
      <file>images/starmask_stars.jpg</file>
      <file>images/startrails.jpg</file>
      <file>images\theory/calibration2.jpg</file>
      <file>images\theory/calibration20.jpg</file>
      <file>images\theory/nocalibration.jpg</file>
      <file>images\theory/stack_1.jpg</file>
      <file>images\theory/stack_16.jpg</file>
      <file>images\theory/stack_2.jpg</file>
      <file>images\theory/stack_32.jpg</file>
      <file>images\theory/stack_4.jpg</file>
    </files>

and the qch and qhc files built just fine.

I was lead to believe that the html renderer used by Qt Assistant DID support this so I'm more than somewhat disappointed.

Perdrix

I have a small test case for this which I can make available as a zip file but don't know how I can attach that. So you can DL it from here:
http://www.perdrix.co.uk/Hover%20Test%20Case.zip

Dl and unpack the zip and view the html file with a browser and see what should happen.

Now run assistant -collectionFile test.qhc and see the hover failing to work.

David

Christian Ehrlicher

Not that you know this already since weeks... https://forum.qt.io/topic/161285/qt-assistant-and-mouseover

Perdrix

NO that was MOUSEOVER - this is HOVER which I was told was supported

kkoehne

Qt Assistant uses litehtml as rendering engine. Compared to 'proper' HTML5 rendering engines like Chromium, litehtml is very lightweight ... but it also doesn't support nearly as much features. So your experience might wary.

A good way to experiment with litehtml alone is testing with https://github.com/litehtml/litebrowser . If things work there and not within Qt Assistant, it might be something we can fix.

On the specific request: It looks like litehtml supports hover, but not the CSS has() selector. This is just from browsing the source code though, I didn't actually experiment further.

Perdrix

Many thanks for the explanation and suggestion of litebrowser for testing.

I uploaded the files to my website:
http://www.perdrix.co.uk/test.html
and litebrowser did rather better than assistant in that at least the default image was displayed, which assistant didn't manage.

Unfortunately hovering over e.g. "32 Images" didn't switch to the correct image for that (which isn't unexpected given what you say about lack of support for the has() selector).

Can anyone can see a way to achieve what I want w/o needing the has() selector, I'd be most grateful (I'm operating on the bleeding edge of my html knowledge here).

PS I asked in the litehtml Discussion section on Github whether has() might appear soonish.
David

Perdrix

Doesn't Qt ship with the Chromium rendering engine, have you considered using that for Assistant rather than using litehtml?

David