• Resolved Prof Parks

    (@prof-parks)


    How can I make a smaller font & transparent background for the Description Boxes? See [shortcode] version on https://cn.profparks.com near the bottom of the page.

    Because the current large font and dark background of the descripton boxes to not go with the look and feel of this site, I tried them in “hide and pop-up when hover” mode. That makes them disappear.

    I would prefer, however, to show the titles, but in a smaller dark font on a transparent background. An alternate background would be a light color that matches the site’s color scheme.

    https://www.ads-software.com/extend/plugins/slideshow-jquery-image-gallery/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Stefan Boonstra

    (@stefanboonstra)

    You can adapt the slideshow’s CSS by settings its style settings to ‘Custom’. The following lines of CSS are used to manipulate the description box:

    .slideshow_container .transparent {
    	filter: alpha(opacity = 50); /* These two lines set the regular transparancy of the description boxes. */
    	opacity: 0.5;
    }
    
    .slideshow_container .transparent:hover {
    	filter: alpha(opacity = 80); /* These two lines set the transparancy of the description boxes when a mouse is hovered over them. */
    	opacity: 0.8;
    }
    
    .slideshow_container .description {
    	background: #000; /* This line sets the background of each description box. */
    }

    Full transparancy would of course be 100 or 1.0.

    The fonts can be set like this:

    .slideshow_container h2 {
    	margin: 5px;
    	font-size: 25px; /* Add this line to adjust the font size to any number of pixels you'd like, this will adjust the title's size. */
    }
    
    .slideshow_container p {
    	margin: 7px;
    	font-size: 15px; /* The same goes for this line, but affects the paragraph (description). */
    }
    Thread Starter Prof Parks

    (@prof-parks)

    I never ever thought I would do CSS, but you make it look almost understandable. Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Smaller font & transparent background for Description Boxes?’ is closed to new replies.