Skip to content

News Carousel

Olivier Carpentier edited this page Nov 6, 2016 · 7 revisions

Note: The SharePoint Framework is currently in preview and is subject to change. SharePoint Framework client-side web parts are not currently supported for use in production environments.

News Carousel Web Part Overview

The news carousel web parts renders a dynamic news slider carousel in your page. This web part implements unitegallery.js (a popular jquery script) as a client side web part for SharePoint.

news carousel

Properties

You can configure the following Web Part settings:

  • items: you can manage a list of news items. A news item is composed with the following fields: Title (mandatory), Description, Enable (mandatory), Link Url (mandatory), Picture (mandatory)
  • Enable Arrows: enable arrows onslider element
  • Enable Bullets: enable the bullets onslider element
  • Enable Play Button: true,false - enable play / pause button onslider element
  • Enable Fullscreen Button: true,false - enable fullscreen button onslider element
  • Enable Zoom Panel: true,false - enable the zoom buttons, works together with zoom control.
  • Controls Always On: true,false - controls are always on, false - show only on mouseover
  • Preserve Ratio: true, false - preserver ratio when on window resize
  • Pause On Mouseover: true,false - pause on mouseover when playing slideshow true/false
  • Carousel: true,false - next button on last image goes to first image.
  • Autoplay: true / false - begin slideshow autoplay on start
  • Speed: play interval of the slideshow
  • Transition: fade, slide - the transition of the slide change
  • Enable Progress Indicator: enable progress indicator element
  • Text Panel Enable: enable textpanel
  • Text Panel Always On Top: textpanel always visible
  • Text Panel Opacity: textpanel background opacity
  • Text Panel Font: textpanel title font family. if null - take from css
  • Text Panel Font Size: textpanel title font size. if null - take from css
  • Text Panel Font Color: textpanel title color. if null - take from css
  • Text Panel Background Color: textpanel background color
  • Text Panel Align: textpanel title text align. if null - take from css
Clone this wiki locally