Code

Discussion on TotalScroll - Multi-Column Layout Scrolling jQuery Plugin

Discussion on TotalScroll - Multi-Column Layout Scrolling jQuery Plugin

Cart 43 sales

flGravity supports this item

Supported

This author's response time can be up to 5 business days.

16 comments found.

Hey there, I’m trying to run this when a modal opens. The content is dynamically generated. No errors at the moment, and postition: relative is being applied via your plugin on the columns, but no transform. Can you assist?

Dear flGravity creator, i have purchased your plugin but have 2 issues after re-building your stripes example. First issue is that my page contains a footer that is covered by the columns through their “ts-sticky”-class. By the positioning “bottom:0px” and “position:fixed” i don´t see a chance to align the footer below the three columns. The second issue is that once the shorter columns come to their end they don´t smoothly “dock” on the top but suddenly stick to the top border, here is my example:

https://mvonh.de/secure-uploads/0-wp-master/multiple-column-scroll/

My goal would be to

1. have a footer alining below the three strip columns 2. see the columns smoothly dock on top of the screen after coming to their end.

Thanks in advance for your time and support, i appreciate your help a lot! Best regards, Erasmus

Really great software to use with grids.

I’ve edited your code (@ line #247) to allow for a continuous content scrolling layout.

Change [ position : ‘fixed’ ] to [ position: ‘sticky’ ]

This allows for content, below totalScroll effected content, to be viewed without overlap of fixed position elements.

Hi there, I’d like to add content underneath the columns. I’ve added a div, however, as the columns are getting a position:fixed applied once they hit the bottom of the container, they overlap the content below. Is there a simple fix for this so I can display content underneath the columns – E.g. so columns don’t have position fixed applied when they hit the bottom of the container? – I’ve created a quick example using the demo. If you scroll to the bottom you’ll see the issue:

https://wellness-edit.com/testing/

In case anyone else runs into the same problem I solved this by changing the position ‘fixed’ to ‘sticky’ (N.B this won’t work in <= IE11).

An example of the code below:

$('.yourContainer').totalScroll({ // Your options here onScroll: function(columns, position){ // Loop through each item when it reaches the bottom of the page $('.ts-sticky').each(function(){ // Delete the duplicate columns created var id = $(this).attr('id'); $('#' + id + '_copy').remove(); // Change positioning from fixed to sticky $(this).css({ 'position': 'sticky', 'top': 0, 'left': 0 }); }); } });

Hi, we bought the plugin and we’re having some troubles with it, because we have a page with a footer.

We included the js library and we called the function before the closing tag.

We already wrote an email related to the question. Please can you contatct us in order to provide a suggestion?

Thank you

Hi ,

I just purchased your plug-in for my WP website, but when I try to instalI it, I keep getting the following message:

Installing Plugin from uploaded file: codecanyon-18967103-totalscroll-multicolumn-layout-scrolling-jquery-plugin.zip

Unpacking the package… Installing the plugin… The package could not be installed. No valid plugins were found. Plugin installation failed.

FYI, I am using an Oshine based theme (up to date and purchased from Envato) and have this version of WP: Version 5.1.1

Can you please help?

However, if this plug-in is not compatible, could I kindly request a refund since I am not able to use it for my site?

Many thanks for kind support. Kind Regards,

Mark Shaw

Hi, I have recently downloaded this plugin and its great! However, I would like to add a div below the main columns so I can add additional content below this (see example here: http://hatchpr.pipeten.co.uk/test/)

Is there also a way I can add the {class=”ts-reveal”} to a div so I can revel the text on scroll too.

I hope you can help. Thanks Wayne

Hi!

you can add a div below total scroll container. If there will be any issues you can contact me and I will help to fix them.

Regarding ts-reveal class, it works only in totalscroll columns. You should look for specific plugin to reveal content that can work in body of your website – https://scrollrevealjs.org/

Hi, I have recently downloaded this plugin and its great! However, I would like to add a div below the main columns so I can add additional content below this (see example here: http://hatchpr.pipeten.co.uk/test/)

Is there also a way I can add the {class=”ts-reveal”} to a div so I can revel the text on scroll too.

I hope you can help. Thanks Wayne

Hi! See my reply in another comment.

Hi, may I know if there’s a way to calculate the columns’ heights correctly before the images are loaded?

Yes, sure.

thanks – could you please share your email address with me?

Hi! You can write me via my profile page here – https://codecanyon.net/user/flgravity

Hi, I would like to know if the second column could follow the end of the first column on the mobile version. And what’s the use of “singleColumn” option?

Here’s my test: http://morningthinker.com/bka/demo1/desktop/

Cheers, Anna

You can fix this by triggering resize event after TotalScroll init

$(widow).trigger('resize');

it should force plugin to check for window size

that works! thanks for the tips :)

No problem!

Hi,

I would like to know if this plugin works with bootstrap version 4 or not, thanks!

Cheers, Anna

Hi! It should work. But if you will have any trobles getting it to work I can fix for free.

Is it possible to get this to work with a 2 column setup where 1 column is a fixed width ?

Like for example: http://www.dynamicdrive.com/style/layouts/item/css_liquid_layout_22_fluid_fixed/ (just a quick rough example)

I’m so sorry!.. I approved refund.

Anyway.. TotalScroll should work with the layout as in your example. If you are still interested please give me the link where you use my plugin and I will check it tomorrow.

this does not work with widths smaller than 900. the columns are on top of each other. I need it to follow the bootrap3 grid settings. How do I disable this plugin on smaller screens?

Thanks, Steven webmaster@protradepubinc.com

Hi! May I take a look on your website. I think I can solve this issue

I have sent you email.

I purchased you TotalScroll which doesn’t seem to support a footer. How can I use a footer to where the columns don’t overlay it. Please help. webmaster@protradepubinc.com Thanks, Steven

Hi Steven! I sent you email. Please give me link to check and I think I will help you with your problems.

awesome! any plans to make this a wordpress VC add on or plugin?

Thanks! I created this plugin after I made a site for customer that uses this effect. I think this plugin can be more interesting for theme developers rather than for all day usage. TotalScroll requires site layout with vertical columns to work. But all sites are different so this can be a problem in case Wordpress plugin.

understood. much thanks!

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey