Jump to content

Kurouto Skin FIX, gallery to many image


chuliano
 Share

Recommended Posts

Kurouto Skin FIX, gallery to many image 

UPDATE 11-12-2014 jQuery custom content scroller

i try to put over 15 images to X product, and the images of gallery go over the div.

 

this is my solution. (sorry for my bad english)

 

in the Kurouto Skin "styles" folder,

 

and Edit file "common.css"

 

find id "#gallery_select" and replace with this code:

 

#gallery_select {
   float: left;
   text-align: center;
   width: 80px;
   overflow: auto;
   height: 300px; // height you wish...
}
i hope this is useful for someone.  blush.png
 
Including the Custom content scroller:
 
Example in skin Kurouto MOD  
 
(there have many themes you can use!! LINKS Themes!)
 
2 - Create a folder in your store, i prefer this location. (for best organization)
 
{$STORE_URL}/js/customscroller/
 
and put in there the plugin custom scroller.
 
3 - Edit file "skinsyourthemetemplatescontent.product.php"
 
find this code and add before 
<script type="text/javascript">
var gallery_json = {$GALLERY_JSON}
</script>

This Code

    <!-- Custom scroller -->    <link rel="stylesheet" href="{$STORE_URL}/js/customscroller/jquery.mCustomScrollbar.css" /> <!-- Create a folder for the plugin custm scroller jquery -->
    <style>
#gallery_select{ height: 300px; width: 80px; }
/*#gallery_select{ height: 80px; width: 580px; }
#gallery{ height: 400px; }*/ /*if you like horizontal gallery */
</style>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><!-- Only if you dont load before -->
    <script src="{$STORE_URL}/js/customscroller/jquery.mCustomScrollbar.js"></script> <!-- Create a folder for the plugin custm scroller jquery -->
<script>
$("#gallery_select").mCustomScrollbar(
{
snapAmount:60,
scrollInertia:100,
     autoHideScrollbar: true,
axis:"y", // axis:"x", if you like horizontal gallery
theme:"inset-2-dark",
advanced:{
autoExpandHorizontalScroll:true
},
scrollButtons:{
enable:true
},
}
);
</script>
    <!-- Custom scroller -->
 <script type="text/javascript">
var gallery_json = {$GALLERY_JSON}
 </script>

wala!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...