Responsive Layout

Imported from Yahoo
1

Hi All,

I’m looking to display our SailWave results using a responsive layout.

I have got it to work using https://github.com/ghepting/jquery-responsive-tables Jquery plugin - please see the Summary table on this link:

http://gogodigitalmedia.com/sailwave/gogo_resp.htm

However, is there a way of doing this without having to modify the code after publishing. I’m struggling to see how I could use a custom plugin and style to get all the table classes renamed to ‘responsive’ and then have the relevant html data attributes assigned.

Like so:

<table class="responsive" data-min="10" data-max="30" cellpadding="0" cellspacing="0">

I hope you can help!

Kind Regards,

Jack

2

Hi Jack,

Have a read of the new effects help on the Sailwave website.

http://www.sailwave.com/how-do-i-write-a-publishing-effect

If particular with reference to libraries.txt which is were you would load your plugin from.

Your own effect then needs to 2 stages. 1 Programatically edit the DOM to give the tables the required classes and attributes and 2. initialise the plugin (must be after 1).

i.e. use somehting like $(‘table’).addClass(‘responsive’) to add the class and use .attr() to add the attributes. Then initialise the plugin.

If you are not developing this for general use by Saiwlave users you can ignore the effects doc and just edit your publishing template appropriately. Possibly easier in the first instance, to get it working…

···

On Tue, Aug 18, 2015 at 8:19 AM, jabah0@yahoo.com [sailwave] sailwave@yahoogroups.com wrote:

Hi All,

I’m looking to display our SailWave results using a responsive layout.

I have got it to work using https://github.com/ghepting/jquery-responsive-tables Jquery plugin - please see the Summary table on this link:

http://gogodigitalmedia.com/sailwave/gogo_resp.htm

However, is there a way of doing this without having to modify the code after publishing. I’m struggling to see how I could use a custom plugin and style to get all the table classes renamed to ‘responsive’ and then have the relevant html data attributes assigned.

Like so:

<table class="responsive" data-min="10" data-max="30" cellpadding="0" cellspacing="0">

I hope you can help!

Kind Regards,

Jack

Cheers,

Colin J

http://sailwave.com

3

Hi Colin,

Thank you very much for your helpful reply. I’ll give it a go and let you know if it works!

Kind Regards,

Jack