How to Make Slideshow Hyperlinks Clickable

This forum is only for questions or discussions about working with the mojoPortal source code in Visual Studio, obtaining the source code from the repository, developing custom features, etc. If your question is not along these lines this is not the right forum. Please try to post your question in the appropriate forum.

Please do not post questions about design, CSS, or skinning here. Use the Help With Skins Forum for those questions.

This forum is for discussing mojoPortal development

This forum is only for questions or discussions about working with the mojoPortal source code in Visual Studio, obtaining the source code from the repository, developing custom features, etc. If your question is not along these lines this is not the right forum. Please try to post your question in the appropriate forum.

You can monitor commits to the repository from this page. We also recommend developers to subscribe to email notifications in the developer forum as occasionally important things are announced.

Before posting questions here you might want to review the developer documentation.

Do not post questions about design, CSS, or skinning here. Use the Help With Skins Forum for those questions.
This thread is closed to new posts. You must sign in to post in the forums.
7/3/2013 4:51:28 PM
Gravatar
Total Posts 29

How to Make Slideshow Hyperlinks Clickable

I found myself really needing to use the Slideshow option in the HTML module, AND being able to click on hyperlinks. On our site, we don't need to be able to switch to the next pane in the slideshow by clicking, because we are showing the pager.

In the documentation, it says this:

Note: Links you place within the elements of a slide show will not be clickable. You can work around this by adding some JavaScript code to your links as follows:

onclick="window.open(this.href,'_self');return false; "

Sad to say, but there's no way our editors could handle such a workaround. Simple for developers. Impossible for marketers. Nor can we instruct our users to right-click on a hyperlink. They need it to be seamless.

Well, here's an easier way. Just disable the click event for the slideshow. I inserted the bold text below into the $(document).ready() script block of the skin's master document (layout.Master). (If the master document doesn't have a $(document).ready() block, create one.)

$(document).ready(function() {

   ...

   $(".slidecontainer").off("click");  

});

It's the "slidecontainer" class div that fires the click event to move to the next slide. This one line turns off the mouse click on the slider. The pager still works. And hyperlinks in the content work normally for users.

CORE TEAM: This could probably be handled with a simple setting option in the module's code, which works only if the pager is enabled.

7/4/2013 12:18:53 PM
Gravatar
Total Posts 18439

Re: How to Make Slideshow Hyperlinks Clickable

Hi David,

Excellent suggestion and easy to implement. I've added a setting for Enable Slide Click true by default but if unchecked we add a line of code as you suggested to turn off the click event on the slide so that the slide content can be clickable.

This is now in the source code repository so it will be in the next release.

Thanks,

Joe

You must sign in to post in the forums. This thread is closed to new posts.