• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
MagicMirror Forum
  • Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
A New Chapter for MagicMirror: The Community Takes the Lead
Read the statement by Michael Teeuw here.

MMM-Carousel showPageControls not visible

Scheduled Pinned Locked Moved Troubleshooting
2 Posts 2 Posters 1.4k Views 2 Watching
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • R Offline
    radonk
    last edited by Oct 30, 2017, 2:04 PM

    Hi everybody,

    I recently configured the MMM-Carousel module in slide configuration and everything is working fine except that i set showPageControls: ‘true’
    but the buttons for next or previews slide are not visible. I know they are there if i hover with my mouse over them they show up.

    Is there a possibility to display them permanently?

    Cheer
    Karsten

    1 Reply Last reply Reply Quote 0
    • A Offline
      Area 49
      last edited by Nov 26, 2017, 2:52 AM

      I just came across this post while also looking for a way to do this. After not finding any answer by searching, I decided to look at the css files included with this module and see if I could figure it out.

      I’m a new at this, but easily found the lines to make changes at for displaying the pointer visibility:

      in MMM-Carousel.css, make the following changes (in Bold):
      …
      .control label {
      z-index: 0;
      display: none;
      text-align: center;
      line-height: 50px;
      position: relative;
      width: 50px;
      height: 50px;
      left: 33%; /* Center in .control div: this.width / .control.width; /
      top: 33%; /
      Center in .control div: this.height / .control.height;; */
      font-size: 50px;
      color: #FFF;
      cursor: pointer !important;
      opacity: 0.5;
      }

      /Increase brightness when directly over/
      .control label:hover {
      opacity: 1.0;
      }
      …

      1 Reply Last reply Reply Quote 0
      • 1 / 1
      • First post
        Last post
      Enjoying MagicMirror? Please consider a donation!
      MagicMirror created by Michael Teeuw.
      Forum managed by Sam, technical setup by Karsten.
      This forum is using NodeBB as its core | Contributors
      Contact | Privacy Policy