{"id":1078,"date":"2021-01-28T07:43:50","date_gmt":"2021-01-28T07:43:50","guid":{"rendered":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/?page_id=1078"},"modified":"2021-03-16T08:20:20","modified_gmt":"2021-03-16T08:20:20","slug":"funny-image-slider","status":"publish","type":"page","link":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/funny-image-slider\/","title":{"rendered":"Funny Image Slider"},"content":{"rendered":"<p>[vc_row][vc_column][vc_column_text]<\/p>\n<h4 style=\"text-align: center;\"><p><strong>Slider By Layout 3<\/strong><\/h4>\n<p>&nbsp;<\/p>\n<script>\r\njQuery( document ).ready(function() {\r\n\tjQuery('.first-sample-50 .slider').blue_slider({\r\n\t\t\/\/preset 1\r\n\t\t\r\n\t\t\/\/preset 2\r\n\t\t\r\n\t\t\/\/preset 3\r\n\t\t\t\tslide_template: '3fr 1fr',\r\n\t\tcurrent_fr_index: 1,\r\n\t\tstart_slide_index: 1, \r\n\t\tcurrent_fr_index_flow: false,\t\t\t\t\t\t\t\t\/\/ (default: true)\r\n\t\t\r\n\t\t\/\/preset 4\r\n\t\t\r\n\t\t\/\/preset 5\r\n\t\t\r\n\t\t\/\/preset 6\r\n\t\t\t\t\r\n\t\tauto_play: true,\t\t\t\t\t\t\/\/ to auto play slides (default: false)\r\n\t\tauto_play_period: 3000,\t\t\t\/\/ auto play speed time (default: 3000) 3sec\r\n\t\tspeed: 2500,\t\t\t\t\t\/\/ slide transition time (default: 1000) 1 Sec\r\n\r\n\t\tslide_gap: 10,\t\t\t\t\t\t\/\/ gap between 2 slides (default: 0)\r\n\r\n\t\t\/\/ease_function: 'easeOutBounce',\t\t\t\t\t\t\t\t\/\/ transition animation (default: 'ease-out')\r\n\t\t\/\/slide_step: 2,\t\t\t\t\t\t\t\t\t\t\t\t\/\/ no. of slides jumps to go to next slide (default: 1) slide ungalna\r\n\t\tcurrent_fr_class: 'my-fr-current',\t\t\t\t\t\t\t\t\/\/ highlighting the current frame . Name of the current frame class to make it active \r\n\t\tactive_fr_class: 'my-fr-active',\t\t\t\t\t\t\t\t\/\/ not in use in css right now\r\n\t\t\/\/custom_fr_class: '       fr-1         fr-2        fr-3    ',\t\/\/ not in use in css right now\r\n\t\t\/\/ left_padding: 30,\t\t\t\t\t\t\t\t\t\t\t\/\/ left padding (default: 0) padding left side of slide (not good\/reliable)\r\n\t\t\/\/ right_padding: 30,\t\t\t\t\t\t\t\t\t\t\t\/\/ right padding (default: 0) padding right side of slide (not good\/reliable)\r\n\t\tsencitive_drag: 100,\t\t\t\t\t\t\t\t\t\t\t\/\/ dont know what it is doing (default: 100)\r\n\t\tloop: false,\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ no effect (default: false)\r\n\t\tarrows: true,\t\t\t\t\t\t\t\t\t\t\t\t\t\/\/ prev and next button enable disable (default: false)\r\n\t\tprev_arrow: '.first-sample-50 .prev-slide',\t\t\t\t\t\t\/\/ class name of prev arrow button element\r\n\t\tnext_arrow: '.first-sample-50 .next-slide',\t\t\t\t\t\t\/\/ class name of next arrow button element\r\n\t});\r\n});\r\n<\/script>\r\n\r\n<!-- slider start-->\r\n<div class=\"sf-3-50\">\r\n\t<div class=\"first-sample-50\">\r\n\t\t<div class=\"slider\">\r\n\t\t\t\t\t\t<div class=\"item\">\r\n\t\t\t\t\t<img decoding=\"async\" class=\"sf-3-slide-image\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/Two-Stupid-Minions.jpg\" alt=\"Two Stupid Minions\">\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t<div class=\"item\">\r\n\t\t\t\t\t<img decoding=\"async\" class=\"sf-3-slide-image\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/Three-funny-minions.jpg\" alt=\"Three funny minions\">\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t<div class=\"item\">\r\n\t\t\t\t\t<img decoding=\"async\" class=\"sf-3-slide-image\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/Superman-Funny.jpg\" alt=\"Superman Funny\">\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t<div class=\"item\">\r\n\t\t\t\t\t<img decoding=\"async\" class=\"sf-3-slide-image\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/Jack-Russell-Terrier-Funny.jpg\" alt=\"Jack Russell Terrier Funny\">\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t<div class=\"item\">\r\n\t\t\t\t\t<img decoding=\"async\" class=\"sf-3-slide-image\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/Hindi-Funny-Frog.jpg\" alt=\"Hindi-Funny-Frog\">\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t<div class=\"item\">\r\n\t\t\t\t\t<img decoding=\"async\" class=\"sf-3-slide-image\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/Funny-Minions.jpg\" alt=\"Funny Minions\">\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t<div class=\"item\">\r\n\t\t\t\t\t<img decoding=\"async\" class=\"sf-3-slide-image\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/Funny-Minions-Golmaal.jpg\" alt=\"Funny Minions Golmaal\">\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t<div class=\"item\">\r\n\t\t\t\t\t<img decoding=\"async\" class=\"sf-3-slide-image\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/Funny-Minion.jpg\" alt=\"Funny Minion\">\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t<div class=\"item\">\r\n\t\t\t\t\t<img decoding=\"async\" class=\"sf-3-slide-image\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/Funny-Cartoon.jpg\" alt=\"Funny Cartoon\">\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\r\n\t\t<\/div>\r\n\t\t\t\t<i class=\"prev-slide \"><i class=\"fa fa-arrow-circle-left\"><\/i><\/i>\r\n\t\t<i class=\"next-slide \"><i class=\"fa fa-arrow-circle-right\"><\/i><\/i>\r\n\t\t\r\n\t<\/div>\r\n<\/div>\r\n<!-- slider end-->\r\n\r\n<style>\r\n.sf-3-50 {\r\n\twidth: 100%;\r\n\theight: 500px;\r\n}\r\n\r\n.sf-3-slide-content {\r\n\r\n}\r\n\r\n.sf-3-slide-title {\r\n\r\n}\r\n.sf-3-slide-desc {\r\n\r\n}\r\n\r\n\r\n\/* main css start *\/\r\n.first-sample-50 {\r\n\twidth: 100%;\t\t\t\t\/* width of slider *\/\r\n\theight: 100%;\t\t\t\t\/* height of slider *\/\r\n\tborder: 5px solid #1c1c1c;\t\/* border color\/thickness of slider *\/\r\n\tborder-radius: 3px;\r\n\tposition: relative;\r\n\tbackground-color: #1c1c1c\t\/* background color of slider *\/\r\n}\r\n\r\n.first-sample-50 .slider {\r\n  height: 100%\r\n}\r\n\r\n.first-sample-50 .slider .slide-wrapper {\r\n  overflow: hidden;\r\n  -webkit-user-select: none;\r\n  -moz-user-select: none;\r\n  -ms-user-select: none;\r\n  user-select: none\r\n}\r\n\r\n.first-sample-50 .slider .slide-tracker .my-fr-current .item::before {\r\n  background-color: rgba(0, 0, 0, 0);\r\n}\r\n\r\n.first-sample-50 .slider .item {\r\n  width: 100%;\r\n  height: 100%;\r\n  overflow: hidden;\r\n  position: relative\r\n}\r\n\r\n.first-sample-50 .slider .item::before {\r\n  content: '';\r\n  position: absolute;\r\n  left: 0;\r\n  top: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  background-color: rgba(0, 0, 0, 0.8);\r\n  transition: background-color 1s\r\n}\r\n\r\n.first-sample-50 .slider .item img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\t\t\t\t\/* image fit or Zoom 100% *\/\r\n  object-position: center center\r\n}\r\n\r\n.first-sample-50 .prev-slide,\r\n.first-sample-50 .next-slide {\r\n  position: absolute;\r\n  top: 50%;\r\n  transform: translateY(-50%);\r\n  font-size:50px;\t\t\t\t\t\/* button size in px *\/\r\n  cursor: pointer;\r\n  color: #888;\t\t\t\t\t\/* button color *\/\r\n  transition: color .3s\r\n}\r\n\r\n.first-sample-50 .prev-slide:hover,\r\n.first-sample-50 .next-slide:hover {\r\n  color: #ccc \t\t\t\t\t\/* button hover color *\/\r\n}\r\n\r\n\/* position of previous button from slider container (default -70 px) *\/\r\n.first-sample-50 .prev-slide {\r\n  left: 0px\r\n}\r\n\r\n\/* position of next button from slider container (default -70 px) *\/\r\n.first-sample-50 .next-slide {\r\n  right: 0px\r\n}\r\n\/* main css end *\/\r\n\r\n\/* media query CSS start *\/\r\n@media only screen and (max-width: 600px) {\r\n\t.sf-3-50 {\r\n\t\theight: 250px;\r\n\t}\r\n}\r\n\/* media query CSS end *\/\r\n\r\n<\/style>\r\n\n<\/p>\n\n<div class=\"wp-block-spacer\" style=\"height: 100px;\" aria-hidden=\"true\">\u00a0<\/div>\n\n<h5 style=\"text-align: center;\"><strong>This slider is made by layout 3<\/strong><\/h5>\n<p><strong>Settings Used :<\/strong>\u00a0Design Preset \u2013 3, Auto Play \u2013 ON, Auto Play Speed \u2013 3000ms, Transition Speed \u2013 2500ms, Slider Navigation Arrows \u2013 ON.<\/p>\n\n<p>&nbsp;<\/p>\n<p>[\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>[vc_row][vc_column][vc_column_text] This slider is made by layout 3 Settings Used :\u00a0Design Preset \u2013 3, Auto Play \u2013 ON, Auto Play Speed \u2013 3000ms, Transition Speed \u2013 2500ms, Slider Navigation Arrows \u2013 ON. &nbsp; [\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":27,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1078","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/pages\/1078","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/comments?post=1078"}],"version-history":[{"count":5,"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/pages\/1078\/revisions"}],"predecessor-version":[{"id":2860,"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/pages\/1078\/revisions\/2860"}],"wp:attachment":[{"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/media?parent=1078"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}