locked
Stop scrolling RRS feed

  • Question

  • User-401818107 posted

    Hi I want to stop the scrolling if it reaches the last image in the folder. Please advise! Thank you!

     <ul id="carousel" class="jcarousel jcarousel-skin-tango">
    				<li><a href="#" rel="p1"><img src="images/small/1.jpg" ></a></li>
    				<li><a href="#" rel="p2"><img src="images/small/2.jpg" ></a></li>
    				<li><a href="#" rel="p3"><img src="images/small/3.jpg" ></a></li>
    				<li><a href="#" rel="p4"><img src="images/small/4.jpg"></a></li>
    	            <li><a href="#" rel="p5"><img src="images/small/5.jpg" ></a></li>
    				
    			  </ul>
    		

    Friday, December 14, 2018 6:18 PM

All replies

  • User475983607 posted

    Read the support docs to verify the 3rd party jcarousel supports your requirement.

    https://sorgalla.com/jcarousel/

    https://sorgalla.com/jcarousel/docs/plugins/autoscroll/

    Friday, December 14, 2018 6:43 PM
  • User-401818107 posted

    If it is not possible . I will do in this way. I have stored image path in mysql database.The scroll image should have as many images as they are in my sql table.Below is my sql table image

    Sku, img1, img2, img3, img4, img5, img6
    A: img1: images/A/1.jpg, img2: images/A/2.jpg, img3: images/A/3.jpg, img4: images/A/4.jpg
    B: img1: images/B/1.jpg, img2: images/B/2.jpg, img3: images/B/3.jpg,

    if A has 4 entries, there should have 4 scrolls images or if B has 3 entries, there should have 3 scrolls of images and so on.

    Friday, December 14, 2018 7:09 PM
  • User-401818107 posted

    It is similar to the link https://sorgalla.com/jcarousel/examples/connected-carousels/

    And I change to the vertical instead of the horizontal. The program is working. But I have problems now if all the items do not have the equal images. Otherwise it will be displayed as x no images. That is the question I posted to the forum. Per the suggestion as below by the expert:

    @{DirectoryInfo dir = new DirectoryInfo(Server.MapPath(Url.Content("~/Content/Images")));}
    @foreach (var file in dir.GetFiles())
    {
        <img src="@Url.Content("~/Content/Images/" + file.Name)" />
    }
    I modified the images on the scroll area, but bigger thumbnail is not responsive and it does not work.
    Please advise! Thank you!
    Friday, December 14, 2018 7:20 PM
  • User475983607 posted

    Is this a different subject? 

    The best I can guess is changing to vertical causes a variable horizontal image width due to how image aspect ratios work.  

    I recommend looking into using an image editor like Photoshop to make consistent image sizes.

    Friday, December 14, 2018 7:58 PM
  • User-401818107 posted

    Yes, I do have the consistent size for all the images. thank you!

    Friday, December 14, 2018 9:05 PM
  • User-401818107 posted

    It is urgent and please advise! Thank you!

    Saturday, December 15, 2018 5:21 AM
  • User-401818107 posted

    I have solved this. Thanks for everyone's advice!

    Sunday, December 16, 2018 3:24 AM
  • User-2054057000 posted

    Hello Jessy, 

    The feature which you are trying to build is known as AUTO Paging. It involves the following steps:

    1. The jQuery detects if the scroll bar has reached the page end or not. 
    2. If the page end is reached then a C# function is called that sends the .aspx page with more images. 
    3. If all images are already loaded then the process completes. 

    Kindly see the reference tutorial - How To Implement jQuery Infinite Scroll Feature For Auto Paging

    Thanks & Regards

    Thursday, December 20, 2018 12:45 PM