{"id":19461630,"url":"https://github.com/fionnachan/fifi-slider","last_synced_at":"2025-07-05T09:05:52.954Z","repository":{"id":128393397,"uuid":"84518161","full_name":"fionnachan/fifi-Slider","owner":"fionnachan","description":"Supports IE10+. Pure JavaScript. Non-jQuery-dependent. CSS3 transition.","archived":false,"fork":false,"pushed_at":"2017-03-20T11:01:21.000Z","size":30,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-07-02T10:08:10.574Z","etag":null,"topics":["css3-animations","no-jquery","plugin","pure-javascript","slider","slider-plugin","vanilla-javascript"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/fionnachan.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-03-10T04:10:10.000Z","updated_at":"2021-06-09T12:43:01.000Z","dependencies_parsed_at":null,"dependency_job_id":"03ee96d4-d489-4fba-a9c9-b5f336c7960e","html_url":"https://github.com/fionnachan/fifi-Slider","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/fionnachan/fifi-Slider","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fionnachan%2Ffifi-Slider","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fionnachan%2Ffifi-Slider/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fionnachan%2Ffifi-Slider/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fionnachan%2Ffifi-Slider/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fionnachan","download_url":"https://codeload.github.com/fionnachan/fifi-Slider/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fionnachan%2Ffifi-Slider/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263715327,"owners_count":23500242,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css3-animations","no-jquery","plugin","pure-javascript","slider","slider-plugin","vanilla-javascript"],"created_at":"2024-11-10T17:43:00.267Z","updated_at":"2025-07-05T09:05:52.933Z","avatar_url":"https://github.com/fionnachan.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# fifi-Slider\nSupports IE10+. Pure JavaScript. Non-jQuery-dependent. CSS3 transition.\n\n[Slider Demo 1 on CodePen](http://codepen.io/fionnachan/pen/Qppdgj)\n\n[Slider Demo 2 on CodePen](http://codepen.io/fionnachan/pen/ryYrpP)\n\n#### For the DOM:\n```\n.slider\n  \u003c!-- repeat below for more slides--\u003e\n  .slide\n    img(src=\"your-image-here\")\n    \u003c!-- you can also have more \u003cdiv/\u003es or \u003cp/\u003es here for text--\u003e \n  \u003c!-- repeat above for more slides--\u003e\n\n.dots-wrapper(id=\"dots-wrapper-4\")\n```\n\n#### For the script:\n\n\u003cpre\u003evar test_slider = new fifi_slider({\n  target: document.querySelector('.slider'),\n  dotsWrapper: document.querySelector('.dots-wrapper'),\n  arrowLeft: document.querySelector('.arrowLeft'), // build your own arrow and pass it in, the plugin will attach a click eventlistener\n  arrowRight: '', // leave it as '' if you don't need arrows\n  autoplay: { // autoplay function not built yet***\n    on: false,\n    interval: 1000 // in ms\n  },\n  transition: {\n    speed: 300, // in ms\n    easing: '' // CSS3 easing as 'linear' in transition: all 0.6s linear;\n  },\n  swipe: true,\n  autoHeight: true,\n  startSlide: 0, // from 0,\n  afterChangeSlide: function afterChangeSlide() {} // customized callback after changing the slide\n});\u003c/pre\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffionnachan%2Ffifi-slider","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffionnachan%2Ffifi-slider","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffionnachan%2Ffifi-slider/lists"}