javascript - add slide function to multiply items -



javascript - add slide function to multiply items -

i added jquery mobile v1.2.0 our manifest add together slide funtion mobile devices. show accommodation template:

:javascript $(document).ready(function() { $("#mycarousel").swiperight(function() { $("#mycarousel").carousel('prev'); }); $("#mycarousel").swipeleft(function() { $("#mycarousel").carousel('next'); }); });

images:

#mycarousel.carousel.slide .carousel-inner - @house.attachments.each_with_index |a, index| %div{ :class => "#{index == 0 ? 'active item' : 'item'}" } = link_to(image_tag(a.file.url), photo_country_region_house_path(@country, @region, @house) ) %a.carousel-control.left %i.fa.fa-arrow-circle-left.fa-2x{"data-slide" => "next", :href => "#mycarousel"} %a.carousel-control.right %i.fa.fa-arrow-circle-right.fa-2x{"data-slide" => "prev", :href => "#mycarousel"}

this works fine 1 accommodation. how must deal listing page?

this code:

- @houses.each |house| .item.col-sm-4.col-lg-4.col-md-4.col-xs-6{:class => house.features_to_html_class, data: {name: house.name, myorder: house.bedrooms, ranking: house.sorting} } .product .image .thumbnail .carousel.slide{id: "mycarousel#{house.id}"} / carousel items .carousel-inner - house.attachments.limit(3).each_with_index |a, index| %div{ :class => "#{index == 0 ? 'active item' : 'item'}" } = link_to(image_tag(a.file.url), country_region_house_path(house.country, house.region, house)) %a.carousel-control.left %i.fa.fa-arrow-circle-left{"data-slide" => "next", :href => "#mycarousel#{house.id}"} %a.carousel-control.right %i.fa.fa-arrow-circle-right{"data-slide" => "prev", :href => "#mycarousel#{house.id}"}

how implement javascript code? carousel id's different in listing.

thanks..remco

my solution might odd bind carousel properly

- @houses.each |house| .item.col-sm-4.col-lg-4.col-md-4.col-xs-6{:class => house.features_to_html_class, data: {name: house.name, myorder: house.bedrooms, ranking: house.sorting} } .product .image .thumbnail .carousel.slide{id: "mycarousel#{house.id}"} / carousel items .carousel-inner - house.attachments.limit(3).each_with_index |a, index| %div{ :class => "#{index == 0 ? 'active item' : 'item'}" } = link_to(image_tag(a.file.url), country_region_house_path(house.country, house.region, house)) %a.carousel-control.left %i.fa.fa-arrow-circle-left{"data-slide" => "next", :href => "#mycarousel#{house.id}"} %a.carousel-control.right %i.fa.fa-arrow-circle-right{"data-slide" => "prev", :href => "#mycarousel#{house.id}"} :javascript $(document).ready(function() { $("#mycarousel#{house.id}").swiperight(function() { $("#mycarousel#{house.id}").carousel('prev'); }); $("#mycarousel#{house.id}").swipeleft(function() { $("#mycarousel#{house.id}").carousel('next'); }); });

javascript ruby-on-rails ruby-on-rails-4

Comments

Popular posts from this blog

formatting - SAS SQL Datepart function returning odd values -

c++ - Apple Mach-O Linker Error(Duplicate Symbols For Architecture armv7) -

php - Yii 2: Unable to find a class into the extension 'yii2-admin' -