Smooth Scrolling Promoted Links

I would like to start off by saying a big thank you to Thomas Kahn for doing all the hard work.

I come up with an idea to use the much-loved Promoted Links web part as a carousel. I thought that someone must have done this already, so I started with a Google search, but I couldn’t find a solution. I then started to look for away to carousel the divs within the Promoted Links web part and I found Thomas’s website



Upload all the required scripts and images, add a Promoted Links and Script Editor web parts to your page and insert the script below (update URL’s).

.ms-promlink-body {width: 90%; height: 150px; position: relative;}
.ms-promlink-header {display: none;}

<link rel="Stylesheet" type="text/css" href="http://intranet/Documents/css/smoothDivScroll.css" />

<script src="" type="text/javascript"></script>
<script src="http://intranet/Documents/js/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
<script src="http://intranet/Documents/js/jquery.mousewheel.min.js" type="text/javascript"></script>
<script src="http://intranet/Documents/js/jquery.kinetic.min.js" type="text/javascript"></script>
<script src="http://intranet/Documents/js/jquery.smoothdivscroll-1.3-min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function () {

mousewheelScrolling: "allDirections",
manualContinuousScrolling: true,
autoScrollingMode: "onStart"

$("#promotedlinksbody_WPQ2").bind("mouseover", function() {
}).bind("mouseout", function() {


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s