{"id":1061,"date":"2018-09-14T13:10:40","date_gmt":"2018-09-14T06:10:40","guid":{"rendered":"https:\/\/www.yellowweb.id\/blog\/?p=1061"},"modified":"2018-09-14T13:10:40","modified_gmt":"2018-09-14T06:10:40","slug":"fullpage-slideshow-jquery","status":"publish","type":"post","link":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/","title":{"rendered":"Fullpage Slideshow (jQuery)"},"content":{"rendered":"<p>Halo teman-teman apa kabar \ud83d\ude42<br \/>\nNah tulisan kali ini kita akan mencoba, sebuah tutorial slideshow dengan menggunakan library jQuery dan sebuah Plugin jQuery tentunya. Plugin yang akan kita gunakan namanya NOSlideshow. Untuk tutorial kali ini lebih tepatnya kita akan membuat efek fullpage slideshow, jadi jika teman-teman ingin membuat sebuah slideshow, namun ukuran gambar full sesuai dengan ukuran layar, so teman-teman dapat menggunakan cara berikut.<br \/>\n<!--more--><\/p>\n<p>Isi di tag body<\/p>\n<pre class=\"lang:default decode:true \" >&lt;div class=\"wrapper\"&gt;\r\n  &lt;div class=\"text-wrapper\"&gt;\r\n    &lt;div class=\"cover-body\"&gt;\r\n      &lt;div class=\"cover-body-inner\"&gt;\r\n        &lt;div class=\"cover-title\"&gt; &lt;a href=\"#\" class=\"link-item title\"&gt;NOSlideShow.js&lt;\/a&gt; &lt;\/div&gt;\r\n        &lt;div class=\"cover-description\"&gt;\r\n          &lt;p&gt;A Background Slideshow Plugin&lt;\/p&gt;\r\n          &lt;p class=\"cover-subtitle\"&gt;&lt;\/p&gt;\r\n        &lt;\/div&gt;\r\n        &lt;div class=\"cover-actions\"&gt; &lt;\/div&gt;\r\n      &lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n  &lt;\/div&gt;\r\n  &lt;div class=\"cover-img cover-img__b\"&gt;&lt;\/div&gt;\r\n  &lt;div class=\"cover-img cover-img__a\"&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;<\/pre>\n<p>Kemudian sisipkan embededd css sebagai berikut:<\/p>\n<pre class=\"lang:default decode:true \" >&lt;style&gt;\r\n.wrapper {\r\n\r\nwidth:150px;\r\nheight:300px;\r\n\r\n}\r\n\r\n.text-wrapper {\r\n  position:absolute;\r\n  bottom:0;\r\n  left:0;\r\n  width:100%;\r\n  height:200px;\r\n}\r\n&lt;\/style&gt;<\/pre>\n<p>jangan lupa untuk bagian tag headnya sisipkan beberapa file css berikut:<\/p>\n<pre class=\"lang:default decode:true \" >&lt;link href=\"style\/main.css\" rel=\"stylesheet\"&gt;\r\n&lt;link href=\"style\/main.structure.css\" rel=\"stylesheet\"&gt;\r\n&lt;link href=\"style\/provisional.css\" rel=\"stylesheet\"&gt;<\/pre>\n<p>source nanti bisa teman-teman unduh. Kemudian jangan lupa untuk menyisipkan file javascriptnya, sebagai berikut:<\/p>\n<pre class=\"lang:default decode:true \" >&lt;script src=\"http:\/\/code.jquery.com\/jquery-3.1.1.min.js\"&gt;&lt;\/script&gt; \r\n&lt;script src=\"js\/NOSlideShow.js\"&gt;&lt;\/script&gt; \r\n&lt;script&gt;\r\n\r\nvar mySlideShow = new SlideShow('projectSlides');\r\n    mySlideShow.container.label = $(\".cover-subtitle\");\r\n    mySlideShow.container.image = $(\".cover-img.cover-img__a\");\r\n    mySlideShow.container.background = $(\".cover-img.cover-img__b\");\r\n\r\n  \/\/ Set Slides.\r\n  mySlideShow.setSlides([{name: 'First Slide', image: 'https:\/\/unsplash.it\/1800\/1600\/?random'},\r\n                         {name: 'Second Slide', image: 'https:\/\/unsplash.it\/1800\/1200\/?random'},\r\n                         {name: 'Third Slide', image: 'https:\/\/unsplash.it\/1800\/1500\/?random'},\r\n                         {name: 'Fouth Slide', image: 'https:\/\/unsplash.it\/1800\/1400\/?random'}\r\n                        ]);\r\n\r\n  \/\/ Display first slide.\r\n  mySlideShow.displaySlide();\r\n\r\n  \/\/ Loop slides.\r\n  var showInterval = setInterval(\"mySlideShow.advanceSlide()\", 3000);\r\n\r\n\r\n\r\n&lt;\/script&gt;<\/pre>\n<p>Untuk kodenya secara utuh sebagai berikut:<\/p>\n<pre class=\"lang:default decode:true \" >&lt;!DOCTYPE html&gt;\r\n&lt;html&gt;\r\n&lt;head&gt;\r\n&lt;meta http-equiv=\"Content-Type\" content=\"text\/html; charset=UTF-8\" \/&gt;\r\n&lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge,chrome=1\"&gt;\r\n&lt;meta name=\"viewport\" content=\"width=device-width,initial-scale=1\"&gt;\r\n&lt;title&gt;jQuery NOSlideShow Plugin Demo&lt;\/title&gt;\r\n&lt;link href=\"style\/main.css\" rel=\"stylesheet\"&gt;\r\n&lt;link href=\"style\/main.structure.css\" rel=\"stylesheet\"&gt;\r\n&lt;link href=\"style\/provisional.css\" rel=\"stylesheet\"&gt;\r\n&lt;\/head&gt;\r\n\r\n&lt;body&gt;\r\n&lt;style&gt;\r\n.wrapper {\r\n\r\nwidth:150px;\r\nheight:300px;\r\n\r\n}\r\n\r\n.text-wrapper {\r\n  position:absolute;\r\n  bottom:0;\r\n  left:0;\r\n  width:100%;\r\n  height:200px;\r\n}\r\n&lt;\/style&gt;\r\n&lt;div class=\"wrapper\"&gt;\r\n  &lt;div class=\"text-wrapper\"&gt;\r\n    &lt;div class=\"cover-body\"&gt;\r\n      &lt;div class=\"cover-body-inner\"&gt;\r\n        &lt;div class=\"cover-title\"&gt; &lt;a href=\"#\" class=\"link-item title\"&gt;NOSlideShow.js&lt;\/a&gt; &lt;\/div&gt;\r\n        &lt;div class=\"cover-description\"&gt;\r\n          &lt;p&gt;A Background Slideshow Plugin&lt;\/p&gt;\r\n          &lt;p class=\"cover-subtitle\"&gt;&lt;\/p&gt;\r\n        &lt;\/div&gt;\r\n        &lt;div class=\"cover-actions\"&gt; &lt;\/div&gt;\r\n      &lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n  &lt;\/div&gt;\r\n  &lt;div class=\"cover-img cover-img__b\"&gt;&lt;\/div&gt;\r\n  &lt;div class=\"cover-img cover-img__a\"&gt;&lt;\/div&gt;\r\n&lt;\/div&gt;\r\n&lt;script src=\"http:\/\/code.jquery.com\/jquery-3.1.1.min.js\"&gt;&lt;\/script&gt; \r\n&lt;script src=\"js\/NOSlideShow.js\"&gt;&lt;\/script&gt; \r\n&lt;script&gt;\r\n\r\nvar mySlideShow = new SlideShow('projectSlides');\r\n    mySlideShow.container.label = $(\".cover-subtitle\");\r\n    mySlideShow.container.image = $(\".cover-img.cover-img__a\");\r\n    mySlideShow.container.background = $(\".cover-img.cover-img__b\");\r\n\r\n  \/\/ Set Slides.\r\n  mySlideShow.setSlides([{name: 'First Slide', image: 'https:\/\/unsplash.it\/1800\/1600\/?random'},\r\n                         {name: 'Second Slide', image: 'https:\/\/unsplash.it\/1800\/1200\/?random'},\r\n                         {name: 'Third Slide', image: 'https:\/\/unsplash.it\/1800\/1500\/?random'},\r\n                         {name: 'Fouth Slide', image: 'https:\/\/unsplash.it\/1800\/1400\/?random'}\r\n                        ]);\r\n\r\n  \/\/ Display first slide.\r\n  mySlideShow.displaySlide();\r\n\r\n  \/\/ Loop slides.\r\n  var showInterval = setInterval(\"mySlideShow.advanceSlide()\", 3000);\r\n\r\n\/*\r\n\/\/ Layout\r\nfunction adjustCoverImage() {\r\n  var width = $(\".cover\").width();\r\n  var height = width * 0.50;\r\n  $(\".cover\").height(height+'px');\r\n}\r\n\r\n$(window).resize(function() { \r\n  adjustCoverImage();\r\n});\r\n\r\n$(document).ready(function() { \r\n  adjustCoverImage();\r\n});*\/\r\n\r\n&lt;\/script&gt;\r\n&lt;\/body&gt;\r\n&lt;\/html&gt;<\/pre>\n<p>Download berkasnya disini<br \/>\n<a href=\"https:\/\/drive.google.com\/open?id=1eVGJNPsEYbzqOTtO-wbmx7pkLdsD7trA\" rel=\"noopener\" target=\"_blank\">https:\/\/drive.google.com\/open?id=1eVGJNPsEYbzqOTtO-wbmx7pkLdsD7trA<\/a><\/p>\n<p>Untuk hasilnya teman-teman dapat lihat live seperti berikut:<\/p>\n<p><iframe loading=\"lazy\" width=\"100%\" height=\"300\" src=\"\/\/jsfiddle.net\/miftahfs\/Lyw32bdq\/4\/embedded\/js,html,css,result\/dark\/\" allowfullscreen=\"allowfullscreen\" allowpaymentrequest frameborder=\"0\"><\/iframe><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Halo teman-teman apa kabar \ud83d\ude42 Nah tulisan kali ini kita akan mencoba, sebuah tutorial slideshow dengan menggunakan library jQuery dan sebuah Plugin jQuery tentunya. Plugin yang akan kita gunakan namanya NOSlideshow. Untuk tutorial kali ini lebih tepatnya kita akan membuat efek fullpage slideshow, jadi jika teman-teman ingin membuat sebuah slideshow, namun ukuran gambar full sesuai [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1063,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[283,116],"tags":[156,18,117,467],"class_list":["post-1061","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","category-jquery","tag-javascript","tag-jquery","tag-plugin","tag-slideshow"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Fullpage Slideshow (jQuery) - YELLOWWEB.ID<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Fullpage Slideshow (jQuery) - YELLOWWEB.ID\" \/>\n<meta property=\"og:description\" content=\"Halo teman-teman apa kabar \ud83d\ude42 Nah tulisan kali ini kita akan mencoba, sebuah tutorial slideshow dengan menggunakan library jQuery dan sebuah Plugin jQuery tentunya. Plugin yang akan kita gunakan namanya NOSlideshow. Untuk tutorial kali ini lebih tepatnya kita akan membuat efek fullpage slideshow, jadi jika teman-teman ingin membuat sebuah slideshow, namun ukuran gambar full sesuai [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/\" \/>\n<meta property=\"og:site_name\" content=\"YELLOWWEB.ID\" \/>\n<meta property=\"article:published_time\" content=\"2018-09-14T06:10:40+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i0.wp.com\/www.yellowweb.id\/blog\/wp-content\/uploads\/2018\/09\/slideshow.jpg?fit=600%2C290&ssl=1\" \/>\n\t<meta property=\"og:image:width\" content=\"600\" \/>\n\t<meta property=\"og:image:height\" content=\"290\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"yellowweb\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"yellowweb\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/\"},\"author\":{\"name\":\"yellowweb\",\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/#\\\/schema\\\/person\\\/75188044e080844724e381ab6a5b9829\"},\"headline\":\"Fullpage Slideshow (jQuery)\",\"datePublished\":\"2018-09-14T06:10:40+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/\"},\"wordCount\":127,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/09\\\/slideshow.jpg\",\"keywords\":[\"javascript\",\"jquery\",\"plugin\",\"slideshow\"],\"articleSection\":[\"JavaScript\",\"jQuery\"],\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/\",\"url\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/\",\"name\":\"Fullpage Slideshow (jQuery) - YELLOWWEB.ID\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/09\\\/slideshow.jpg\",\"datePublished\":\"2018-09-14T06:10:40+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/#\\\/schema\\\/person\\\/75188044e080844724e381ab6a5b9829\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/09\\\/slideshow.jpg\",\"contentUrl\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/09\\\/slideshow.jpg\",\"width\":600,\"height\":290,\"caption\":\"slideshow\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/fullpage-slideshow-jquery\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Fullpage Slideshow (jQuery)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/\",\"name\":\"YELLOWWEB.ID\",\"description\":\"Kursus Web Design | Kursus Web Programming | Mobile Web Apps | Digital Marketing\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/#\\\/schema\\\/person\\\/75188044e080844724e381ab6a5b9829\",\"name\":\"yellowweb\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5afd1bfac26e9377e8f5e36afb624cf3690dd31cb07c3961dfbc736b9ff1912f?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5afd1bfac26e9377e8f5e36afb624cf3690dd31cb07c3961dfbc736b9ff1912f?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5afd1bfac26e9377e8f5e36afb624cf3690dd31cb07c3961dfbc736b9ff1912f?s=96&d=mm&r=g\",\"caption\":\"yellowweb\"},\"sameAs\":[\"https:\\\/\\\/www.yellowweb.id\"],\"url\":\"https:\\\/\\\/www.yellowweb.id\\\/blog\\\/author\\\/yellowweb\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Fullpage Slideshow (jQuery) - YELLOWWEB.ID","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/","og_locale":"en_GB","og_type":"article","og_title":"Fullpage Slideshow (jQuery) - YELLOWWEB.ID","og_description":"Halo teman-teman apa kabar \ud83d\ude42 Nah tulisan kali ini kita akan mencoba, sebuah tutorial slideshow dengan menggunakan library jQuery dan sebuah Plugin jQuery tentunya. Plugin yang akan kita gunakan namanya NOSlideshow. Untuk tutorial kali ini lebih tepatnya kita akan membuat efek fullpage slideshow, jadi jika teman-teman ingin membuat sebuah slideshow, namun ukuran gambar full sesuai [&hellip;]","og_url":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/","og_site_name":"YELLOWWEB.ID","article_published_time":"2018-09-14T06:10:40+00:00","og_image":[{"width":600,"height":290,"url":"https:\/\/i0.wp.com\/www.yellowweb.id\/blog\/wp-content\/uploads\/2018\/09\/slideshow.jpg?fit=600%2C290&ssl=1","type":"image\/jpeg"}],"author":"yellowweb","twitter_card":"summary_large_image","twitter_misc":{"Written by":"yellowweb","Estimated reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/#article","isPartOf":{"@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/"},"author":{"name":"yellowweb","@id":"https:\/\/www.yellowweb.id\/blog\/#\/schema\/person\/75188044e080844724e381ab6a5b9829"},"headline":"Fullpage Slideshow (jQuery)","datePublished":"2018-09-14T06:10:40+00:00","mainEntityOfPage":{"@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/"},"wordCount":127,"commentCount":0,"image":{"@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/#primaryimage"},"thumbnailUrl":"https:\/\/www.yellowweb.id\/blog\/wp-content\/uploads\/2018\/09\/slideshow.jpg","keywords":["javascript","jquery","plugin","slideshow"],"articleSection":["JavaScript","jQuery"],"inLanguage":"en-GB","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/","url":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/","name":"Fullpage Slideshow (jQuery) - YELLOWWEB.ID","isPartOf":{"@id":"https:\/\/www.yellowweb.id\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/#primaryimage"},"image":{"@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/#primaryimage"},"thumbnailUrl":"https:\/\/www.yellowweb.id\/blog\/wp-content\/uploads\/2018\/09\/slideshow.jpg","datePublished":"2018-09-14T06:10:40+00:00","author":{"@id":"https:\/\/www.yellowweb.id\/blog\/#\/schema\/person\/75188044e080844724e381ab6a5b9829"},"breadcrumb":{"@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/"]}]},{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/#primaryimage","url":"https:\/\/www.yellowweb.id\/blog\/wp-content\/uploads\/2018\/09\/slideshow.jpg","contentUrl":"https:\/\/www.yellowweb.id\/blog\/wp-content\/uploads\/2018\/09\/slideshow.jpg","width":600,"height":290,"caption":"slideshow"},{"@type":"BreadcrumbList","@id":"https:\/\/www.yellowweb.id\/blog\/fullpage-slideshow-jquery\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.yellowweb.id\/blog\/"},{"@type":"ListItem","position":2,"name":"Fullpage Slideshow (jQuery)"}]},{"@type":"WebSite","@id":"https:\/\/www.yellowweb.id\/blog\/#website","url":"https:\/\/www.yellowweb.id\/blog\/","name":"YELLOWWEB.ID","description":"Kursus Web Design | Kursus Web Programming | Mobile Web Apps | Digital Marketing","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.yellowweb.id\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-GB"},{"@type":"Person","@id":"https:\/\/www.yellowweb.id\/blog\/#\/schema\/person\/75188044e080844724e381ab6a5b9829","name":"yellowweb","image":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/secure.gravatar.com\/avatar\/5afd1bfac26e9377e8f5e36afb624cf3690dd31cb07c3961dfbc736b9ff1912f?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/5afd1bfac26e9377e8f5e36afb624cf3690dd31cb07c3961dfbc736b9ff1912f?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/5afd1bfac26e9377e8f5e36afb624cf3690dd31cb07c3961dfbc736b9ff1912f?s=96&d=mm&r=g","caption":"yellowweb"},"sameAs":["https:\/\/www.yellowweb.id"],"url":"https:\/\/www.yellowweb.id\/blog\/author\/yellowweb\/"}]}},"_links":{"self":[{"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/posts\/1061","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/comments?post=1061"}],"version-history":[{"count":2,"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/posts\/1061\/revisions"}],"predecessor-version":[{"id":1064,"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/posts\/1061\/revisions\/1064"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/media\/1063"}],"wp:attachment":[{"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/media?parent=1061"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/categories?post=1061"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.yellowweb.id\/blog\/wp-json\/wp\/v2\/tags?post=1061"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}