WordPress.org

Ready to get started?Download WordPress

Forums

Simple HTML Slider
Slider Direction - Right to Left (3 posts)

  1. taylorsweb
    Member
    Posted 6 months ago #

    Hello,

    Is there a way to easily change the slider direction so it goes right to left..?

    On your plugins screenshot page:
    http://wordpress.org/plugins/simple-html-slider/screenshots/

    ..it shows 'direction' left to right. I assumed that meant you also had right to left. I didn't see it in the free version so I picked up pro. But it looks like you renamed the functionality and I don't see the other option.. and it's possible it never was an option.

    However, I need the slideshow to slide right to left horizontally. Is there a way to do this? Even if I have to tweak, add and/or maintain jquery/javascript to make it happen?

    Thanks,

    ~Joe

  2. Nishant Jain
    Member
    Plugin Contributor

    Posted 6 months ago #

    Hi taylorsweb,

    Please raise ticket regarding PRO version on SketchThemes.

    http://www.sketchthemes.com/helpdesk/index.php?act=tickets&code=open&step=2&department=2

    Thanks,
    Nishant

  3. ashtonsr04
    Member
    Posted 3 months ago #

    There is only one file to edit: main.php

    Step 1: add a Case "Left" after the break of the case "Right"(add the code below in your main.php)

    case "Left":
    		$toret.="
    
    		var rcount = jQuery('.shs_slider_wrp .shs_items').length; 
    
    		jQuery('#shs_slider_ul .shs_items:first').before(jQuery('#shs_slider_ul .shs_items:last'));
    		var item_width = jQuery('#shs_slider_ul .shs_items').outerWidth();
    		var total_width=jQuery('#shs_slider_ul .shs_items').length;
    		jQuery('#shs_slider_ul').css({'left':'-$width','width':item_width*total_width+10});
    		jQuery('#shs_slider_ul .shs_items').css({'float':'left'});
    
    		function shs_animate_next(){
    			if(rcount < 3){
    				jQuery('#shs_slider_ul').css({'left':'0'});
    				jQuery('#shs_slider_ul .shs_items:last').after(jQuery('#shs_slider_ul .shs_items:first'));
    				jQuery('#shs_slider_ul:not(:animated)').animate({'left' : '-$width'},$trans_time,function(){});
    			}else{
    				var item_width = jQuery('#shs_slider_ul .shs_items').outerWidth();
    				var left_indent = parseInt(jQuery('#shs_slider_ul').css('left')) +item_width;
    				jQuery('#shs_slider_ul:not(:animated)').animate({'left' : left_indent},$trans_time,
    				function(){
    					jQuery('#shs_slider_ul .shs_items:first').after(jQuery('#shs_slider_ul .shs_items:last'));
    					jQuery('#shs_slider_ul').css({'left':'-$width'});
    				});
    			}
    		}
    
    		function shs_animate(){
    			var item_width = jQuery('#shs_slider_ul .shs_items').outerWidth();
    			var left_indent = parseInt(jQuery('#shs_slider_ul').css('left')) - item_width;
    			jQuery('#shs_slider_ul:not(:animated)').animate({'left' : left_indent},$trans_time,
    			function(){
    				jQuery('#shs_slider_ul .shs_items:last').before(jQuery('#shs_slider_ul .shs_items:first'));
    				jQuery('#shs_slider_ul').css({'left':'-$width'});
    			});
    		}";
    		break;

    Step2: Add a new option in the Simple HTML WP-Admin dropdown list (copy and replace the existing select tag in your main.php)

    <select name="direction">
    						<option value="Right" <?php shs_check_for_selected($direction,"Right"); ?> ><?php _e('Horizontal Slide','shs'); ?></option>
    						<option value="Left" <?php shs_check_for_selected($direction,"Left"); ?> ><?php _e('Left Slide','shs'); ?></option>
    						<option value="Down" <?php shs_check_for_selected($direction,"Down"); ?> ><?php _e('Vertical Slide','shs'); ?></option>
    					</select>

    Thats it! Refresh the Simple HTML wp-admin and select the new "Left Slide" (that was just created), Deactivate and activate the plugin, clear the web browser cache and open your web site.

Reply

You must log in to post.

About this Plugin

About this Topic