History: Infinite_carousel

Source of version: 13

{JQ()}$jq(function(){ $jq('#carousel').infiniteCarousel(); });{JQ} {DIV(id=>carousel)} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=85&display",alt="CandiiClouds",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Candii Clouds__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=66|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=86&display",alt="Club Card",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Club Card__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=80|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=87&display",alt="absE",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__absE__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=63|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=88&display",alt="Andreas08",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Andreas08__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=64|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=89&display",alt="Andreas09",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Andreas09__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=65|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=90&display",alt="Eatlon",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Eatlon__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=68|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=91&display",alt="Faulkner",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Faulkner__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=69|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=92&display",alt="Green Blog",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Green Blog__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=79|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=93&display",alt="Dark Shine",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Dark Shine__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=67|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=94&display",alt="Fluid Index",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Fluid Index__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=70|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=95&display",alt="Judy",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Judy (Drupal default theme, Garland)__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=82|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=98&display",alt="Milky Way",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Milky Way (Joomla default theme)__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=83|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=99&display",alt="Smooth",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Smooth__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=75|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=100&display",alt="Snow",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Snow__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=76|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=101&display",alt="Tikipedia",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Tikipedia__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=81|Download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=102&display",alt="Underground",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Underground__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=78|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=103&display",alt="Twist",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Twist__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=77|download]{TAG} {DIV} This uses the Infinite Carousel script for JQuery. See [http://www.catchmyfame.com/2009/08/27/jquery-infinite-carousel-plugin-1-2-released/]. When Tiki 5 was released, this script was included as part of the Tiki package. Until then, it had to be downloaded and installed separately. To make the carousel, there are several steps: {TABS(name="IC_instructions",tabs="Tiki 5|Tiki 4")} # In Tiki 5, Infinite Carousel is included as part of the Tiki package, so there is no need to install the script. # No modification of code is needed. # The necessary CSS still needs to go in the L&F custom html head content, __OR__ it can go in an ~np~{HTML()}{HTML}~/np~ plugin in the wiki page, before the carousel. Example: ** {CODE()}<style type="text/css"> #carousel ul { list-style: none; width: 7600px; margin: 0; padding: 0; position: relative; } #carousel li { display:inline; float:left; background-image: none; padding-left: 0; } </style> {CODE} # The initialization script can go in a JQ plugin in the wiki page, before the image divs. Example: ** {CODE()}{JQ()}$jq(function(){ $jq('#carousel').infiniteCarousel(); });{JQ}{CODE} # The image syntax is added to the page as in Tiki 4 version, as described below. ///// # In Tiki 4, get the script jquery.infinitecarousel.js from the above address. # modify it by changing all instances of "$" in the file to "$jq". This is because JQuery in Tiki is running in compatibility mode. # Upload it to your server. # To initialize the script for use on particular pages, put something like the following in the Look and Feel head custom code. There is an if/then statement that indicates what page the carousel is used on, a link to jquery.infinitecarousel.js, the initialization of the script, and some CSS needed for the carousel div and li items. {CODE()} {* Infinite carousel start *} {if $page eq 'Infinite_carousel' or $page eq 'HomePage' or $page eq 'Tiki 3 Themes'} <script type="text/javascript" src="lib/jquery/infiniteCarousel/jquery.infinitecarousel.js"></script> {literal} <script type="text/javascript"> $jq(function(){ $jq('#carousel').infiniteCarousel(); }); </script> <style type="text/css"> #carousel ul { list-style: none; width: 7600px; margin: 0; padding: 0; position: relative; } #carousel li { display:inline; float:left; background-image: none; padding-left: 0; } </style> {/literal} {/if} {CODE} {TABS} Then the wiki page needs something like the following. Note that there is a div with the id "carousel", and an unordered list containing the image and a paragraph for the caption. {CODE(wrap=1)} {DIV(id=>carousel)} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=85&display",alt="CandiiClouds",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Candii Clouds__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=66|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=86&display",alt="Club Card",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__Club Card__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=80|download]{TAG} * {IMG(src="http://themes.tikiwiki.org/tiki-download_file.php?fileId=87&display",alt="absE",height="265px",width="380px")}{IMG}{TAG(tag=>p)}__absE__ [http://themes.tikiwiki.org/tiki-directory_redirect.php?siteId=63|download]{TAG}{DIV} {CODE} The procedures described above are for Tiki 4 and Tiki 5. For Tiki 3, there is no Look and Feel "html head" custom code textarea, so templates/header.tpl would have to be edited to add the script.

History

Enable pagination rows per page

HTML diff Side-by-side diff Side-by-side diff by characters Inline diff Inline diff by characters Full side-by-side diff Full side-by-side diff by characters Full inline diff Full inline diff by characters Unified diff Side-by-side view HTML diff Side-by-side diff Advanced

Information	Version
Thu 07 of Jun, 2012 22:30 GMT jonnybradley jQuery Plugin modified by editor.	44
Thu 07 of Jun, 2012 21:47 GMT jonnybradley jQuery Plugin modified by editor.	43
Thu 19 of Apr, 2012 00:04 GMT marclaporte Div mismatch	42
Tue 18 of Oct, 2011 16:03 GMT Chealer9 attempt to fix errors with images and use the new example	41
Tue 18 of Oct, 2011 16:01 GMT Chealer9 fix examples using the tiki handler instead (from Jonny's comment)	40
Thu 17 of Mar, 2011 13:09 GMT chibaguy	39
Thu 17 of Mar, 2011 13:06 GMT chibaguy	38
Thu 17 of Mar, 2011 13:05 GMT chibaguy	37
Thu 17 of Mar, 2011 13:04 GMT chibaguy	36
Thu 17 of Mar, 2011 13:03 GMT chibaguy	35
Thu 17 of Mar, 2011 13:01 GMT chibaguy	34
Thu 17 of Mar, 2011 12:55 GMT chibaguy div overflow:hidden added, as per bug3753.	33
Thu 17 of Mar, 2011 07:57 GMT chibaguy Added statement about "TAG" wikiplugin.	32
Sun 06 of Mar, 2011 10:27 GMT yoni	31
Sun 30 of Jan, 2011 06:58 GMT lindon	30
Sun 30 of Jan, 2011 05:02 GMT lindon	29
Tue 04 of Jan, 2011 14:01 GMT yoni Tiki Wiki 6 activation for the script added	28
Tue 04 of Jan, 2011 13:59 GMT yoni	27
Mon 01 of Nov, 2010 16:37 GMT xavi	26
Mon 01 of Nov, 2010 16:24 GMT xavi removing extra line breaks inside the carousel code, which seems to conflict with pluginSPLIT in Tiki6 in Opera, Chrome and Safari, because of the parsin order (according to lph tips on irc)	25
Sat 25 of Sep, 2010 17:23 GMT lindon	24
Sat 25 of Sep, 2010 16:46 GMT lindon	23
Sat 25 of Sep, 2010 16:45 GMT lindon added parameters and tip about different size images	22
Sat 25 of Sep, 2010 16:41 GMT lindon	21
Thu 02 of Sep, 2010 02:03 GMT chibaguy Approved plugins so unbreaking JS.	20
Thu 02 of Sep, 2010 01:59 GMT chibaguy trying to access the plugin approve button	19
Thu 02 of Sep, 2010 01:56 GMT chibaguy tikiwiki to tiki in links.	18
Wed 01 of Sep, 2010 06:09 GMT lindon	17
Sat 31 of Jul, 2010 13:43 GMT chibaguy Angle brackets (in wikitext) got replaced by question marks in an upgrade.	16
Mon 28 of Jun, 2010 18:12 GMT luci style tag shouldn't be in the HTML body	15
Fri 25 of Jun, 2010 17:25 GMT xavi adding forgotten html tags	14
Fri 25 of Jun, 2010 17:24 GMT xavi adding explicit documentation/examples for Tiki5	13
Fri 25 of Jun, 2010 17:16 GMT xavi updated info regarding tiki5 release	12
Mon 10 of May, 2010 09:45 GMT jacmoe	11
Thu 18 of Mar, 2010 01:03 GMT chibaguy [rollback version 8]	10
Fri 19 of Mar, 2010 15:04 GMT chibaguy	9
Thu 18 of Mar, 2010 01:03 GMT chibaguy	8
Wed 17 of Mar, 2010 14:07 GMT chibaguy Updated with Tiki 5 info.	7
Wed 17 of Mar, 2010 14:04 GMT chibaguy	6
Wed 17 of Mar, 2010 13:51 GMT chibaguy	5
Mon 08 of Feb, 2010 09:33 GMT chibaguy Typo.	4
Mon 08 of Feb, 2010 09:25 GMT chibaguy Page created.	3
Tue 01 of Sep, 2009 11:46 GMT chibaguy	2
Tue 01 of Sep, 2009 11:25 GMT chibaguy	1

Select action to perform with checked... Remove OK