Hotspot Problem

Submitted by DMSPeanut on Sun, 04/22/2018 - 17:07
Forums: 
Bugs in content types

I am having a problem with all of the find the hotspot content, this example is the find multiple hotspots.   When i first create the content it looks looks and acts just as it is supposed to, but when i insert the game into my web page it appears with these circles where the hot spots are.  It is doing this on all of our hotspot content.  Please help!    

Additional note that I am using Wordpress.  

Attachments: 
Image icon Find the fa's incorrect.JPG
Image icon Find the Fa's correct.JPG
BV52's picture

BV52

Mon, 04/23/2018 - 06:27

Hi DMSPeanut,

In order to give your bug report the best chance of getting answered, please include the following information:

  1. Detailed steps to reproduce the bug (exactly how and when did it happen)
  2. Platform and version number. E.g. Drupal, Wordpress, Moodle.
  3. Mobile or Desktop
  4. Browser: Chrome, Firefox, Safari etc
  5. H5P plugin version
  6. H5P content type and version (if a content type was used), and a sample URL.
  7. Any browser console errors
  8. Any PHP errors
  9. Screenshots if it's a visual problem

The more information you provide, the quicker the community will be able to fix it and the quicker you'll have a working solution!

-BV52

DMSPeanut

Mon, 04/23/2018 - 12:20

1) Detailed steps to reproduce the bug (exactly how and when did it happen)  I am using H5P to make several games for our wordpress website.  When we initially make the game, it performs beautifully (see screenshot labeled correct), but when put the game into a webpage on our site, the hotspots show up with the circles where the answers should giving away the answers (see screenshot incorrect).  I have included a third screenshot of the set up of the multiple hot spots.  All of the multple hot spots that we have made have done the same thing.  See screenshot #4, also labeled incorrect.  2) Wordpress 4.9.5 3) Desktop 4) I am using micrsofft edge, but it is doing the same in Chrome 5) H5P plugin version - 1.10.1 6) H5P content type and version (if a content type was used), and a sampleURL. 7) Any browser console errors -No errors  8) Any PHP errors [1] - no errors  9) Screenshots if it's a visual problem The more information you provide, the quicker the community will be able tofix it and the quicker you'll have a working solution! 

 

Attachments: 
Image icon Setup of multiple hotspots.JPG
Image icon Find all the Re's - incorrect.JPG
BV52's picture

BV52

Mon, 04/23/2018 - 16:07

Hi DMSPeanut,

Thank you for the additional information. Would you happen to have a URL that we can check?

-BV52

DMSPeanut

Mon, 04/23/2018 - 18:51

Yes, i have put three different ones on here for you to see.  

https://perfectpraisemusic.com/lessons/testing/

 

thomasmars's picture

thomasmars

Wed, 04/25/2018 - 16:20

Hi, your theme has a style that overrides the look of the image hotspots.
You can fix this yourself by adding the following lines to your theme:

.h5p-content .circle {
  border: 0;
  cursor: default;
  float: initial;
  margin-left: 0;
}

DMSPeanut

Fri, 04/27/2018 - 02:25

Yes, that fixed it, perfect!  Thanks so much for your help!