{"action":"created","issue":{"url":"https://api.github.com/repos/malsup/cycle2/issues/68","labels_url":"https://api.github.com/repos/malsup/cycle2/issues/68/labels{/name}","comments_url":"https://api.github.com/repos/malsup/cycle2/issues/68/comments","events_url":"https://api.github.com/repos/malsup/cycle2/issues/68/events","html_url":"https://github.com/malsup/cycle2/issues/68","id":9752643,"number":68,"title":"Responsive Carousel Number Of Items","user":{"login":"alexdoumas","id":2311493,"avatar_url":"https://avatars.githubusercontent.com/u/2311493?v=3","gravatar_id":"","url":"https://api.github.com/users/alexdoumas","html_url":"https://github.com/alexdoumas","followers_url":"https://api.github.com/users/alexdoumas/followers","following_url":"https://api.github.com/users/alexdoumas/following{/other_user}","gists_url":"https://api.github.com/users/alexdoumas/gists{/gist_id}","starred_url":"https://api.github.com/users/alexdoumas/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/alexdoumas/subscriptions","organizations_url":"https://api.github.com/users/alexdoumas/orgs","repos_url":"https://api.github.com/users/alexdoumas/repos","events_url":"https://api.github.com/users/alexdoumas/events{/privacy}","received_events_url":"https://api.github.com/users/alexdoumas/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/malsup/cycle2/labels/carousel","name":"carousel","color":"02d7e1"}],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":10,"created_at":"2013-01-07T23:38:28Z","updated_at":"2015-02-06T13:36:25Z","closed_at":"2013-06-20T19:15:10Z","body":"Hello again,\r\n\r\nIm trying to find a way to change the carouselVisible items in a responsive design.\r\n\r\ni want in a screen resolution of 1200px to show 3 items. and when you scale down in 768 to have 2 items and in 320px 1 item.\r\n\r\nis that possible? i did try to change carousel option on load or resize but it didnt work.\r\n<pre>\r\n<code>\r\n$cycle = $('.cycle-slideshow')\r\n$cycle.each(function(index, element) {\r\n\tif ($(element).hasClass('carousel')) {\r\n\t\t$(window).resize(function(e) {\r\n\t\t\t$(element).cycle({'carouselVisible':1}).cycle('reinit');\r\n\t\t});\r\n\t}\r\n});\r\n</code>\r\n</pre>\r\n\r\nor this way \r\n\r\n<pre>\r\n<code>\r\n$cycle = $('.cycle-slideshow')\r\n$cycle.each(function(index, element) {\r\nif ($(element).hasClass('carousel')) {\r\n\t\t$(window).resize(function(e) {\r\n\t\t\t$(element).attr('data-cycle-carousel-visible',1).cycle('reinit');\r\n\t\t});\r\n\t}\r\n});\r\n\r\n</code>\r\n</pre>\r\nthx again for the great plugin!"},"comment":{"url":"https://api.github.com/repos/malsup/cycle2/issues/comments/73236853","html_url":"https://github.com/malsup/cycle2/issues/68#issuecomment-73236853","issue_url":"https://api.github.com/repos/malsup/cycle2/issues/68","id":73236853,"user":{"login":"colir","id":327347,"avatar_url":"https://avatars.githubusercontent.com/u/327347?v=3","gravatar_id":"","url":"https://api.github.com/users/colir","html_url":"https://github.com/colir","followers_url":"https://api.github.com/users/colir/followers","following_url":"https://api.github.com/users/colir/following{/other_user}","gists_url":"https://api.github.com/users/colir/gists{/gist_id}","starred_url":"https://api.github.com/users/colir/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/colir/subscriptions","organizations_url":"https://api.github.com/users/colir/orgs","repos_url":"https://api.github.com/users/colir/repos","events_url":"https://api.github.com/users/colir/events{/privacy}","received_events_url":"https://api.github.com/users/colir/received_events","type":"User","site_admin":false},"created_at":"2015-02-06T13:36:25Z","updated_at":"2015-02-06T13:36:25Z","body":"...i lloking for this feat too...i did'nt understand why this doesn't work...\r\n\r\nWhen calling destroy, the cycle is remove, but the initCarousel function after doesn't init cycle...\r\n\r\nthanks you very much\r\n\r\n```javascript\r\n$(function(){\r\n   $(window).on('resize',resizeHandler).resize()\r\n})\r\n\r\n\r\nfunction resizeHandler(){\r\n   var nbVisibleSlide = ($(window).width >= 768) ? 6 : 3;\r\n   $('.carousel-holder').cycle('destroy');\r\n   initCarousel(nbVisibleSlide )\r\n}\r\n\r\nfunction initCarousel(nbVisibleSlide){\r\n\t\t$('.carousel-holder').cycle({\r\n\t\t\tspeed: 600\r\n\t\t\t,timeout:2500\r\n\t\t\t,carouselFluid : true\r\n\t\t\t,carouselVisible : nbVisibleSlide\r\n\t\t\t,fx : 'carousel'\r\n\t\t\t,slides :'.carousel-item'\r\n\t\t\t})\r\n\t\t}\r\n```\r\n"}}