{"id":931,"date":"2021-01-28T07:12:44","date_gmt":"2021-01-28T07:12:44","guid":{"rendered":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/?page_id=931"},"modified":"2021-03-16T07:29:11","modified_gmt":"2021-03-16T07:29:11","slug":"team-member-slider","status":"publish","type":"page","link":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/team-member-slider\/","title":{"rendered":"Team Member Slider"},"content":{"rendered":"<p>[vc_row][vc_column][vc_column_text]<\/p>\n<h4 style=\"text-align: center;\"><strong><span style=\"color: #999999;\">Slider By Layout 5<\/span><\/strong><\/h4>\n<p>&nbsp;<\/p>\n<p><style>\r\n.slider-container-65 img {\r\n\twidth : 300px;\r\n\theight : 300px;\r\n}\r\n\r\n\/********* FIX FOR VERTICAL SCROLL BAR 19-JAN-2021 *********\/\r\n.flipster {\r\n\tdisplay: block;\r\n\t\/* overflow-x: hidden; *\/\r\n\t\/* overflow-x: inherit;\r\n\toverflow-y: visible; *\/\r\n\r\n\toverflow: hidden !important;\r\n\r\n\tposition: relative;\r\n}\r\n\r\n\r\n\/********* FIX FOR small screen media query 25-JAN-2021 *********\/\r\n@media only screen and (max-width: 768px) {\r\n\t.slider-container-65 img {\r\n\t\twidth : 300px;\r\n\t}\r\n}\r\n@media only screen and (max-width: 540px) {\r\n\t.slider-container-65 img {\r\n\t\twidth : 170px;\r\n\t}\r\n}\r\n.sf-5-descdiv-65 {\r\ntext-align:center;\r\nposition: absolute;\r\nopacity:0;\r\nbottom: 12%;\r\ncolor: #fff;\r\n\/\/padding:1%;\r\nbackground: rgba(0,0,0,0.5);\r\nwidth: 60%;\r\nleft: 20%;\r\ntransition: all 1s 0.2s ease;\r\nbox-sizing: border-box;\r\n\/\/visibility: hidden;\r\n}\r\n.sf-5-descdiv-65 .sf-5-desc-65 {\r\n\tmargin-top: 0.5%;\r\n\tmargin-bottom: 0.5%;\r\n}\r\n.flipster__item__content:hover .sf-5-descdiv-65 {\r\n\topacity:1;\r\n}\r\n\r\n.sf-5-slide-button-2-65 {\r\nmin-width: 80px;\r\n\tmin-height: 30px;\r\n\t\/\/float: left;\r\n\tmargin: 10px;\r\n\t-webkit-border-radius: 3px;\r\n\t-moz-border-radius: 3px;\r\n\tborder-radius: 3px;\r\n\tborder: none;\r\n\tcolor: #fff;\r\n\tbackground-color: #4e4441;\r\n\tcursor: pointer;\r\n}\r\n\r\n.sf-5-slide-button-2-65:hover {\r\n\tbackground-color: white;\r\n\tcolor: black;\r\n}\r\n\r\n.slider-container-65 ul .flipster__nav__child { font-style : bold;  background :#36ABE0;  }  .slider-container-65 .flipster__nav__link::after { background : #36ABE0; } .slider-container-65 .flipster__item img { border-radius: 50%; margin-top: 10% ;  box-shadow: 5px 20px 30px rgb(0 0 0 \/ 42%);\n } \r\n<\/style>\r\n\r\n<div class=\"slider-container-65\">\r\n\t<ul class=\"flip-items\">\r\n\r\n\t\t\t\t<li data-flip-title=\"Emily\" data-flip-category=\"CEOs\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img2.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tEmily\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/65\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Jorden\" data-flip-category=\"CEOs\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img5.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tJorden\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/65\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Mishel\" data-flip-category=\"Dev Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img1.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tMishel\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Freddie\" data-flip-category=\"Dev Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img8.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tFreddie\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/65\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Herry\" data-flip-category=\"Dev Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img11.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tHerry\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Jack\" data-flip-category=\"Dev Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img13.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tJack\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/65\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"George\" data-flip-category=\"HR Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img4.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tGeorge\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Juliia\" data-flip-category=\"HR Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img10.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tJuliia\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/65\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Anaa\" data-flip-category=\"HR Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img12.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tAnaa\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/65\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Leo\" data-flip-category=\"QA Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img3.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tLeo\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/65\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Olivia\" data-flip-category=\"QA Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img6.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tOlivia\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/65\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Evelyn\" data-flip-category=\"QA Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img9.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/65\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-65\">\r\n\t\t\t\t\t\t\t\tEvelyn\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t<\/ul>\r\n<\/div>\r\n\r\n<script>\r\njQuery( document ).ready(function() {\r\n\tjQuery(\".slider-container-65\").flipster({\r\n\r\n\t\titemContainer: 'ul',\r\n\t\t\/\/ [string|object].\r\n\t\t\/\/ Selector for the container of the flippin' items.\r\n\r\n\t\titemSelector: 'li',\r\n\t\t\/\/ [string|object]\r\n\t\t\/\/ Selector for children of `itemContainer` to flip.\r\n\r\n\t\tstart: 'center', \/\/future.\r\n\t\t\/\/ ['center'|number].\r\n\t\t\/\/ Zero based index of the starting item, or use 'center' to start in the middle.\r\n\r\n\t\tfadeIn: 400,\r\n\t\t\/\/ [milliseconds].\r\n\t\t\/\/ Speed of the fade in animation after items have been setup.\r\n\r\n\t\tloop: true,\r\n\t\t\/\/ [true|false].\r\n\t\t\/\/ Loop around when the start or end is reached.\r\n\r\n\t\t\t\tautoplay: 3500,\t\t\t\t\t\t\t\/\/ true\/false - numbers in milliseconds.\r\n\t\t\t\t\/\/ [false|milliseconds].\r\n\t\t\/\/ If a positive number, Flipster will automatically advance to next item after that number of milliseconds.\r\n\r\n\t\tpauseOnHover: true,\r\n\t\t\/\/ [true|false].\r\n\t\t\/\/ If true, autoplay advancement will pause when Flipster is hovered.\r\n\r\n\r\n\t\t\/\/** Start of preset 1 **\/\/\r\n\t\t\t\t\/\/** End of preset 1 **\/\/.\r\n\r\n\r\n\t\t\/\/** Start of preset 2 **\/\/\r\n\t\t\t\t\/\/** End of preset 2 **\/\/.\r\n\r\n\r\n\t\t\/\/** Start of preset 3 **\/\/\r\n\t\t\t\tstyle: 'wheel',\r\n\t\t\/\/ [coverflow|carousel|flat|wheel]\r\n\t\t\/\/ Adds a class (e.g. flipster--coverflow) to the flipster element to switch between display styles\r\n\t\t\/\/ Create your own theme in CSS and use this setting to have Flipster add the custom class\r\n\r\n\t\tspacing: 0,\r\n\t\t\/\/ [number]\r\n\t\t\/\/ Space between items relative to each item's width. 0 for no spacing, negative values to overlap (default -0.6)\r\n\t\t\t\t\/\/** End of preset 3 **\/\/\r\n\r\n\r\n\t\t\/\/** Start of preset 4 **\/\/\r\n\t\t\t\t\/\/** End of preset 4 **\/\/\r\n\r\n\t\tclick: true,\r\n\t\t\/\/ [true|false]\r\n\t\t\/\/ Clicking an item switches to that item\r\n\r\n\t\tkeyboard: true,\r\n\t\t\/\/ [true|false]\r\n\t\t\/\/ Enable left\/right arrow navigation\r\n\r\n\t\tscrollwheel: true,\r\n\t\t\/\/ [true|false]\r\n\t\t\/\/ Enable mousewheel\/trackpad navigation; up\/left = previous, down\/right = next\r\n\r\n\t\ttouch: true,\r\n\t\t\/\/ [true|false]\r\n\t\t\/\/ Enable swipe navigation for touch devices\r\n\r\n\r\n\t\t\r\n\t\t\t\tnav: 'before',\r\n\t\t\/\/ [true|false|'before'|'after']\r\n\t\t\/\/ If not false, Flipster will build an unordered list of the items\r\n\t\t\/\/ Values true or 'before' will insert the navigation before the items, 'after' will append the navigation after the items\r\n\t\t\t\t\r\n\r\n\t\t\r\n\t\tbuttons: false,\r\n\t\t\/\/ [true|false|'custom']\r\n\t\t\/\/ If true, Flipster will insert Previous \/ Next buttons with SVG arrows\r\n\t\t\/\/ If 'custom', Flipster will not insert the arrows and will instead use the values of `buttonPrev` and `buttonNext`\r\n\r\n\t});\r\n});\r\n<\/script>\r\n\n<br \/>\n<div class=\"wp-block-spacer\" style=\"height: 50px;\" aria-hidden=\"true\">\n<h5>\u00a0<\/h5>\n<h5 style=\"text-align: center;\"><strong>This slider is made by layout 5<\/strong><\/h5>\n<p>&nbsp;<\/p>\n<\/div>\n<p>&nbsp;<\/p>\n\n<p><strong>Settings Used :<\/strong> Design preset &#8211; Wheel , Auto Play &#8211; ON, Autoplay speed -3500 milliseconds, Pause On Mouse Hover &#8211; ON, Loop &#8211; On , Fade In Speed &#8211; 400 milliseconds , Click &#8211; ON, Keyboard Arrow Keys &#8211; ON, Scrool Wheel &#8211; On, Touch &#8211; On, Navigation- Before Slider with Custom CSS<\/p>\n<br \/>\n<div class=\"wp-block-spacer\" style=\"height: 199px;\" aria-hidden=\"true\">\u00a0<\/div>\n<p><br \/><style>\r\n.slider-container-66 img {\r\n\twidth : 300px;\r\n\theight : 300px;\r\n}\r\n\r\n\/********* FIX FOR VERTICAL SCROLL BAR 19-JAN-2021 *********\/\r\n.flipster {\r\n\tdisplay: block;\r\n\t\/* overflow-x: hidden; *\/\r\n\t\/* overflow-x: inherit;\r\n\toverflow-y: visible; *\/\r\n\r\n\toverflow: hidden !important;\r\n\r\n\tposition: relative;\r\n}\r\n\r\n\r\n\/********* FIX FOR small screen media query 25-JAN-2021 *********\/\r\n@media only screen and (max-width: 768px) {\r\n\t.slider-container-66 img {\r\n\t\twidth : 300px;\r\n\t}\r\n}\r\n@media only screen and (max-width: 540px) {\r\n\t.slider-container-66 img {\r\n\t\twidth : 170px;\r\n\t}\r\n}\r\n.sf-5-descdiv-66 {\r\ntext-align:center;\r\nposition: absolute;\r\nopacity:0;\r\nbottom: 12%;\r\ncolor: #fff;\r\n\/\/padding:1%;\r\nbackground: rgba(0,0,0,0.5);\r\nwidth: 60%;\r\nleft: 20%;\r\ntransition: all 1s 0.2s ease;\r\nbox-sizing: border-box;\r\n\/\/visibility: hidden;\r\n}\r\n.sf-5-descdiv-66 .sf-5-desc-66 {\r\n\tmargin-top: 0.5%;\r\n\tmargin-bottom: 0.5%;\r\n}\r\n.flipster__item__content:hover .sf-5-descdiv-66 {\r\n\topacity:1;\r\n}\r\n\r\n.sf-5-slide-button-2-66 {\r\nmin-width: 80px;\r\n\tmin-height: 30px;\r\n\t\/\/float: left;\r\n\tmargin: 10px;\r\n\t-webkit-border-radius: 3px;\r\n\t-moz-border-radius: 3px;\r\n\tborder-radius: 3px;\r\n\tborder: none;\r\n\tcolor: #fff;\r\n\tbackground-color: #4e4441;\r\n\tcursor: pointer;\r\n}\r\n\r\n.sf-5-slide-button-2-66:hover {\r\n\tbackground-color: white;\r\n\tcolor: black;\r\n}\r\n\r\n.slider-container-66 ul .flipster__nav__child { font-style : bold;  background :#11569B;  }  .slider-container-66 .flipster__nav__link::after { background : #11569B; } .slider-container-66 .flipster__item img { border-radius: 50%; margin-top: 10% ;  box-shadow: 5px 20px 30px rgb(0 0 0 \/ 10%);\n } \r\n<\/style>\r\n\r\n<div class=\"slider-container-66\">\r\n\t<ul class=\"flip-items\">\r\n\r\n\t\t\t\t<li data-flip-title=\"Emily\" data-flip-category=\"CEOs\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img2.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tEmily\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/66\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Jorden\" data-flip-category=\"CEOs\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img5.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tJorden\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/66\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Mishel\" data-flip-category=\"Dev Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img1.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tMishel\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Freddie\" data-flip-category=\"Dev Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img8.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tFreddie\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/66\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Herry\" data-flip-category=\"Dev Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img11.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tHerry\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Jack\" data-flip-category=\"Dev Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img13.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tJack\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/66\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"George\" data-flip-category=\"HR Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img4.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tGeorge\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Juliia\" data-flip-category=\"HR Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img10.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tJuliia\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/66\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Anaa\" data-flip-category=\"HR Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img12.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tAnaa\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/66\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Leo\" data-flip-category=\"QA Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img3.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tLeo\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/66\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Olivia\" data-flip-category=\"QA Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img6.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tOlivia\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-desc-http:\/\/66\">\r\n\t\t\t\t\t\t\t\tLorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t\t\t<li data-flip-title=\"Evelyn\" data-flip-category=\"QA Team\">\r\n\t\t\t<img decoding=\"async\" src=\"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-content\/uploads\/sites\/8\/2021\/02\/img9.jpg\">\r\n\t\t\t<div class=\"sf-5-descdiv-http:\/\/66\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"sf-5-title-66\">\r\n\t\t\t\t\t\t\t\tEvelyn\t\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\r\n\t\t\t<\/li>\r\n\t\t\t\t<\/ul>\r\n<\/div>\r\n\r\n<script>\r\njQuery( document ).ready(function() {\r\n\tjQuery(\".slider-container-66\").flipster({\r\n\r\n\t\titemContainer: 'ul',\r\n\t\t\/\/ [string|object].\r\n\t\t\/\/ Selector for the container of the flippin' items.\r\n\r\n\t\titemSelector: 'li',\r\n\t\t\/\/ [string|object]\r\n\t\t\/\/ Selector for children of `itemContainer` to flip.\r\n\r\n\t\tstart: 'center', \/\/future.\r\n\t\t\/\/ ['center'|number].\r\n\t\t\/\/ Zero based index of the starting item, or use 'center' to start in the middle.\r\n\r\n\t\tfadeIn: 400,\r\n\t\t\/\/ [milliseconds].\r\n\t\t\/\/ Speed of the fade in animation after items have been setup.\r\n\r\n\t\tloop: true,\r\n\t\t\/\/ [true|false].\r\n\t\t\/\/ Loop around when the start or end is reached.\r\n\r\n\t\t\t\tautoplay: 3500,\t\t\t\t\t\t\t\/\/ true\/false - numbers in milliseconds.\r\n\t\t\t\t\/\/ [false|milliseconds].\r\n\t\t\/\/ If a positive number, Flipster will automatically advance to next item after that number of milliseconds.\r\n\r\n\t\tpauseOnHover: true,\r\n\t\t\/\/ [true|false].\r\n\t\t\/\/ If true, autoplay advancement will pause when Flipster is hovered.\r\n\r\n\r\n\t\t\/\/** Start of preset 1 **\/\/\r\n\t\t\t\t\/\/** End of preset 1 **\/\/.\r\n\r\n\r\n\t\t\/\/** Start of preset 2 **\/\/\r\n\t\t\t\t\/\/** End of preset 2 **\/\/.\r\n\r\n\r\n\t\t\/\/** Start of preset 3 **\/\/\r\n\t\t\t\t\/\/** End of preset 3 **\/\/\r\n\r\n\r\n\t\t\/\/** Start of preset 4 **\/\/\r\n\t\t\t\tstyle: 'flat',\r\n\t\t\/\/ [coverflow|carousel|flat|wheel]\r\n\t\t\/\/ Adds a class (e.g. flipster--coverflow) to the flipster element to switch between display styles\r\n\t\t\/\/ Create your own theme in CSS and use this setting to have Flipster add the custom class\r\n\r\n\t\tspacing: -0.25,\r\n\t\t\/\/ [number]\r\n\t\t\/\/ Space between items relative to each item's width. 0 for no spacing, negative values to overlap (default -0.6)\r\n\t\t\t\t\/\/** End of preset 4 **\/\/\r\n\r\n\t\tclick: true,\r\n\t\t\/\/ [true|false]\r\n\t\t\/\/ Clicking an item switches to that item\r\n\r\n\t\tkeyboard: true,\r\n\t\t\/\/ [true|false]\r\n\t\t\/\/ Enable left\/right arrow navigation\r\n\r\n\t\tscrollwheel: true,\r\n\t\t\/\/ [true|false]\r\n\t\t\/\/ Enable mousewheel\/trackpad navigation; up\/left = previous, down\/right = next\r\n\r\n\t\ttouch: true,\r\n\t\t\/\/ [true|false]\r\n\t\t\/\/ Enable swipe navigation for touch devices\r\n\r\n\r\n\t\t\r\n\t\t\t\tnav: 'before',\r\n\t\t\/\/ [true|false|'before'|'after']\r\n\t\t\/\/ If not false, Flipster will build an unordered list of the items\r\n\t\t\/\/ Values true or 'before' will insert the navigation before the items, 'after' will append the navigation after the items\r\n\t\t\t\t\r\n\r\n\t\t\r\n\t\tbuttons: false,\r\n\t\t\/\/ [true|false|'custom']\r\n\t\t\/\/ If true, Flipster will insert Previous \/ Next buttons with SVG arrows\r\n\t\t\/\/ If 'custom', Flipster will not insert the arrows and will instead use the values of `buttonPrev` and `buttonNext`\r\n\r\n\t});\r\n});\r\n<\/script>\r\n\n<br \/>\n<div class=\"wp-block-spacer\" style=\"height: 50px;\" aria-hidden=\"true\">\u00a0<\/div>\n<h5 style=\"text-align: center;\"><strong>This slider is made by layout 5<\/strong><\/h5>\n\n<p><strong>Settings Used :<\/strong> Design preset &#8211; Flat , Auto Play &#8211; ON, Autoplay speed -3500 milliseconds, Pause On Mouse Hover &#8211; ON, Loop &#8211; On , Fade In Speed &#8211; 400 milliseconds , Click &#8211; ON, Keyboard Arrow Keys &#8211; ON, Scrool Wheel &#8211; On, Touch &#8211; On, Navigation- Before Slider with Custom CSS<\/p>\n<p>\u00a0<\/p>\n<p>[\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>[vc_row][vc_column][vc_column_text] Slider By Layout 5 &nbsp; Settings Used : Design preset &#8211; Wheel , Auto Play &#8211; ON, Autoplay speed -3500 milliseconds, Pause On Mouse Hover &#8211; ON, Loop &#8211; On , Fade In Speed &#8211; 400 milliseconds , Click &#8211; ON, Keyboard Arrow Keys &#8211; ON, Scrool Wheel &#8211; On, Touch &#8211; On, Navigation- [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":50,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-931","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/pages\/931","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=931"}],"version-history":[{"count":9,"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/pages\/931\/revisions"}],"predecessor-version":[{"id":2827,"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/pages\/931\/revisions\/2827"}],"wp:attachment":[{"href":"https:\/\/wpfrank.com\/demo\/slider-factory-pro\/wp-json\/wp\/v2\/media?parent=931"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}