https://mdn.co.jp/_nuxt/90a7f02.modern.js

1(window.webpackJsonp=window.webpackJsonp||[]).push([[0],{292:function(module,__webpack_exports__,__webpack_require__){"use strict";var IMG_WIDTH=500,IMG_WIDTH_SP=250;__webpack_exports__.a={name:"ModalAd",props:{propPageUrl:{type:String,required:!0}},data:()=>({IMG_WIDTH:IMG_WIDTH,IMG_WIDTH_SP:IMG_WIDTH_SP,welcomeBanner:null,displayWelcomeBanner:!1}),apollo:{},watch:{},mounted(){},created(){this.$store.state.displayWelcomeBanner&&this.$store.state.welcomeBanners&&this.$store.state.welcomeBanners.length>0&&(this.welcomeBanner=this.$store.state.welcomeBanners[0],this.displayWelcomeBanner=!0)},methods:{onCloseWelcomeBanner(){this.displayWelcomeBanner=!1,this.$store.commit("setDisplayWelcomeBanner",!1),this.$router.push({path:this.propPageUrl})},onClickWelcomeBanner(){try{eval(this.welcomeBanner.eventOnclick)}catch(e){console.error("Error executing code:",e)}this.displayWelcomeBanner=!1,this.$store.commit("setDisplayWelcomeBanner",!1)}}}},293:function(e,n,t){"use strict";t.r(n);var r=[function(){var e=this.$createElement,n=this._self._c||e;return n("p",{staticClass:"logo"},[n("img",{attrs:{src:t(37),alt:"デザインってオモシロイ MdN Design Interactive"}})])}],l=t(292).a,d=t(8),component=Object(d.a)(l,(function(){var e=this,n=e.$createElement,t=e._self._c||n;return e.displayWelcomeBanner?t("div",{staticClass:"isOpen",attrs:{id:"modalAd"}},[t("div",{staticClass:"modalOverlay"},[t("div",{staticClass:"modalContent"},[e._m(0),e._v(" "),t("p",{attrs:{id:"viewPage"}},[t("a",{on:{click:e.onCloseWelcomeBanner}},[e._v("この広告を飛ばして記事を見る")])]),e._v(" "),t("p",{attrs:{id:"adImage"}},[t("a",{attrs:{href:e.welcomeBanner.url},on:{click:function(n){return e.onClickWelcomeBanner()}}},[t("Img",{staticClass:"pc",attrs:{"prop-id":e.welcomeBanner.imageId,"prop-width":e.IMG_WIDTH,onload:e.welcomeBanner.eventOnload}}),t("Img",{staticClass:"sp",attrs:{"prop-id":e.welcomeBanner.imageId,"prop-width":e.IMG_WIDTH_SP}})],1)])])])]):e._e()}),r,!1,null,null,null);n.default=component.exports;installComponents(component,{Img:t(36).default,Img:t(36).default})},294:function(e,n,t){"use strict";t.r(n);var r=[function(){var e=this,n=e.$createElement,r=e._self._c||n;return r("section",{attrs:{id:"modCategory"}},[r("div",{staticClass:"inner"},[r("ul",{staticClass:"category"},[r("li",{staticClass:"design"},[r("a",{attrs:{href:"/design/"}},[r("img",{attrs:{src:t(144),alt:"Graphic Design"}}),e._v(" "),r("h3",[e._v("デザインする")]),e._v(" "),r("p",{staticClass:"text"},[e._v("\n            グラフィックアプリの使い方から、デザインの基礎、最新の表現手法まで、デザイナー、イラストレーター、写真家が知りたい情報が満載！\n          ")])])]),e._v(" "),r("li",{staticClass:"web"},[r("a",{attrs:{href:"/web/"}},[r("img",{attrs:{src:t(145),alt:"Web Design"}}),e._v(" "),r("h3",[e._v("WEBをつくる")]),e._v(" "),r("p",{staticClass:"text"},[e._v("\n            HTML、CSS、JavaScriptコーディングから、集客やライティング、マーケティング手法まで、Webに関わるすべての人が知りたいことが分かる！\n          ")])])]),e._v(" "),r("li",{staticClass:"art-culture"},[r("a",{attrs:{href:"/art-culture/"}},[r("img",{attrs:{src:t(146),alt:"Art & Culture"}}),e._v(" "),r("h3",[e._v("アート＆カルチャー")]),e._v(" "),r("p",{staticClass:"text"},[e._v("\n            肩肘はらずに楽しめるアートと、アートを取り入れた身の回りの品々。あなたの生活をちょっと楽しくするアート＆ライフスタイル情報\n          ")])])]),e._v(" "),r("li",{staticClass:"product"},[r("a",{attrs:{href:"/product/"}},[r("img",{attrs:{src:t(147),alt:"Products"}}),e._v(" "),r("h3",[e._v("プロダクトに出会う")]),e._v(" "),r("p",{staticClass:"text"},[e._v("\n            仕事がちょっと楽になる、気持ちがちょっと上がる、思わず人に見せたくなる、そんなプロダクトたちに出会える\n          ")])])])]),e._v(" "),r("ul",{staticClass:"category"},[r("li",{staticClass:"learn-experience"},[r("a",{attrs:{href:"/learn-experience/"}},[r("img",{attrs:{src:t(148),alt:"Experience"}}),e._v(" "),r("h3",[e._v("学ぶ・体験する")]),e._v(" "),r("p",{staticClass:"text"},[e._v("\n            大ヒット書籍の執筆陣が、グラフィックデザインやWeb制作、Webマーケティングに関わるすべての人に贈る信頼のセミナー群\n          ")])])]),e._v(" "),r("li",{staticClass:"takumi"},[r("a",{attrs:{href:"/takumi/"}},[r("img",{attrs:{src:t(149),alt:"Fine article"}}),e._v(" "),r("h3",[e._v("匠の逸品を買う")]),e._v(" "),r("p",{staticClass:"text"},[e._v("\n            日本が誇る匠の技＋他にない独創のデザイン＋見たこともない特別な素材。すべてにこだわり抜いた特別な逸品をお手元にお届けします\n          ")])])]),e._v(" "),r("li",{staticClass:"reference"},[r("a",{attrs:{href:"/reference/"}},[r("h3",[e._v("逆引き辞典")]),e._v(" "),r("p",{staticClass:"text"},[e._v("\n            「こんなことがやりたいんだけど、どうやれば良いの？」が見つかる逆引き辞典。項目数も内容も、続々と増殖中\n          ")])])])]),e._v(" "),r("div",{staticClass:"about"},[r("ul",{staticClass:"other"},[r("li",[r("a",{attrs:{href:"/news/"}},[e._v("ニュース")])]),e._v(" "),r("li",[r("a",{attrs:{href:"/other/"}},[e._v("その他")])])])])])])}],l=t(8),component=Object(l.a)({},(function(){var e=this.$createElement;this._self._c;return this._m(0)}),r,!1,null,null,null);n.default=component.exports;installComponents(component,{Img:t(36).default})},305:function(e,n){var t={kind:"Document",definitions:[{kind:"OperationDefinition",operation:"query",name:{kind:"Name",value:"articles"}

1,variableDefinitions:[{kind:"VariableDefinition",variable:{kind:"Variable",name:{kind:"Name",value:"filter"}},type:{kind:"NonNullType",type:{kind:"NamedType",name:{kind:"Name",value:"ArticleFilterInput"}}},directives:[]},{kind:"VariableDefinition",variable:{kind:"Variable",name:{kind:"Name",value:"limit"}},type:{kind:"NonNullType",type:{kind:"NamedType",name:{kind:"Name",value:"Int"}}},directives:[]},{kind:"VariableDefinition",variable:{kind:"Variable",name:{kind:"Name",value:"page"}},type:{kind:"NonNullType",type:{kind:"NamedType",name:{kind:"Name",value:"Int"}}},directives:[]}],directives:[],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"articles"},arguments:[{kind:"Argument",name:{kind:"Name",value:"filter"},value:{kind:"Variable",name:{kind:"Name",value:"filter"}}},{kind:"Argument",name:{kind:"Name",value:"limit"},value:{kind:"Variable",name:{kind:"Name",value:"limit"}}},{kind:"Argument",name:{kind:"Name",value:"page"},value:{kind:"Variable",name:{kind:"Name",value:"page"}}}],directives:[],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"count"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"articles"},arguments:[],directives:[],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"id"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"title"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"titleText"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"thumbnailId"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"fromDt"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"urlPath"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"articleSet"},arguments:[],directives:[],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"id"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"urlPath"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"title"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"category"},arguments:[],directives:[],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"id"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"urlPath"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"subTitle"},arguments:[],directives:[]}]}}]}}]}}]}}]}}],loc:{start:0,end:398}};t.loc.source={body:"query articles($filter: ArticleFilterInput!, $limit: Int!, $page: Int!) {\n  articles(filter: $filter, limit: $limit, page: $page) {\n    count\n    articles {\n      id\n      title\n      titleText\n      thumbnailId\n      fromDt\n      urlPath\n      articleSet {\n        id\n        urlPath\n        title\n        category {\n          id\n          urlPath\n          subTitle\n        }\n      }\n    }\n  }\n}\n",name:"GraphQL request",locationOffset:{line:1,column:1}};var r={};function l(e,n){for(var i=0;i<e.definitions.length;i++){var element=e.definitions[i];if(element.name&&element.name.value==n)return element}}t.definitions.forEach((function(e){if(e.name){var n=new Set;!function e(n,t){if("FragmentSpread"===n.kind)t.add(n.name.value);else if("VariableDefinition"===n.kind){var r=n.type;"NamedType"===r.kind&&t.add(r.name.value)}n.selectionSet&&n.selectionSet.selections.forEach((function(n){e(n,t)})),n.variableDefinitions&&n.variableDefinitions.forEach((function(n){e(n,t)})),n.definitions&&n.definitions.forEach((function(n){e(n,t)}))}(e,n),r[e.name.value]=n}})),e.exports=t,e.exports.articles=function(e,n){var t={kind:e.kind,definitions:[l(e,n)]};e.hasOwnProperty("loc")&&(t.loc=e.loc);var d=r[n]||new Set,o=new Set,c=new Set;for(d.forEach((function(e){c.add(e)}));c.size>0;){var m=c;c=new Set,m.forEach((function(e){o.has(e)||(o.add(e),(r[e]||new Set).forEach((function(e){c.add(e)})))}))}return o.forEach((function(n){var r=l(e,n);r&&t.definitions.push(r)})),t}(t,"articles")},308:function(e,n,t){"use strict";t.r(n);var r=t(350),l={props:{propDisplay:{type:Number,required:!1,default:()=>null}},data:()=>({ad:null}),apollo:{ads:{prefetch:!0,query:t.n(r).a,variables(){return{display:this.propDisplay}}}},watch:{ads(e){e.length>0&&(this.ad=e[0])}},mounted(){},methods:{}},d=(t(351),t(8)),component=Object(d.a)(l,(function(){var e=this.$createElement,n=this._self._c||e;return this.ad?n("div",{staticClass:"modAdBanner-1"},[n("p",[n("a",{attrs:{href:this.ad.url,target:"_blank",rel:"noopener",onclick:this.ad.eventOnclick}},[n("Img",{staticClass:"pc",attrs:{"prop-id":this.ad.imageId,onload:this.ad.eventOnload}}),n("Img",{staticClass:"sp",attrs:{"prop-id":this.ad.imageSpId}})],1)])]):this._e()}),[],!1,null,null,null);n.default=component.exports;installComponents(component,{Img:t(36).default})},309:function(e,n,t){"use strict";t.r(n);

1var r={name:"ModAdBanner3"},l=t(8),component=Object(l.a)(r,(function(){var e=this.$createElement;this._self._c;return this._e()}),[],!1,null,null,null);n.default=component.exports},310:function(e,n,t){"use strict";t.r(n);var r=[function(){var e=this.$createElement,n=this._self._c||e;return n("div",{staticClass:"modTitle"},[n("h2",[n("img",{attrs:{src:t(353),alt:"Ranking"}}),n("span",[this._v("ランキング")])])])}],l=t(14),d={props:{},data:()=>({RANKING_TYPE_1:l.w,RANKING_TYPE_2:l.x}),computed:{},watch:{},apollo:{},mounted(){},created(){},methods:{}},o=t(8),component=Object(o.a)(d,(function(){var e=this,n=e.$createElement,t=e._self._c||n;return t("section",{attrs:{id:"modRanking"}},[t("div",{staticClass:"inner"},[e._m(0),e._v(" "),t("dl",{staticClass:"ranking"},[t("dt",{staticClass:"active"},[e._v("急上昇ランキング")]),e._v(" "),t("dd",{staticClass:"show"},[t("ModRankingList",{attrs:{"prop-ranking-type":e.RANKING_TYPE_1}})],1),e._v(" "),t("dt",[e._v("連載ランキング")]),e._v(" "),t("dd",[t("ModRankingList",{attrs:{"prop-ranking-type":e.RANKING_TYPE_2}})],1)])])])}),r,!1,null,null,null);n.default=component.exports;installComponents(component,{Img:t(36).default,ModRankingList:t(410).default})},328:function(e,n,t){var content=t(352);"string"==typeof content&&(content=[[e.i,content,""]]),content.locals&&(e.exports=content.locals);(0,t(49).default)("0a8c5100",content,!0,{sourceMap:!1})},350:function(e,n){var t={kind:"Document",definitions:[{kind:"OperationDefinition",operation:"query",name:{kind:"Name",value:"ads"},variableDefinitions:[{kind:"VariableDefinition",variable:{kind:"Variable",name:{kind:"Name",value:"display"}},type:{kind:"NamedType",name:{kind:"Name",value:"Int"}},directives:[]}],directives:[],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"ads"},arguments:[{kind:"Argument",name:{kind:"Name",value:"display"},value:{kind:"Variable",name:{kind:"Name",value:"display"}}}],directives:[],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"imageId"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"imageSpId"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"title"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"url"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"eventOnload"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"eventOnclick"},arguments:[],directives:[]}]}}]}}],loc:{start:0,end:152}};t.loc.source={body:"query ads($display: Int) {\n    ads(display: $display) {\n      imageId\n      imageSpId\n      title\n      url\n      eventOnload\n      eventOnclick\n    }\n}",name:"GraphQL request",locationOffset:{line:1,column:1}};var r={};function l(e,n){for(var i=0;i<e.definitions.length;i++){var element=e.definitions[i];if(element.name&&element.name.value==n)return element}}t.definitions.forEach((function(e){if(e.name){var n=new Set;!function e(n,t){if("FragmentSpread"===n.kind)t.add(n.name.value);else if("VariableDefinition"===n.kind){var r=n.type;"NamedType"===r.kind&&t.add(r.name.value)}n.selectionSet&&n.selectionSet.selections.forEach((function(n){e(n,t)})),n.variableDefinitions&&n.variableDefinitions.forEach((function(n){e(n,t)})),n.definitions&&n.definitions.forEach((function(n){e(n,t)}))}(e,n),r[e.name.value]=n}})),e.exports=t,e.exports.ads=function(e,n){var t={kind:e.kind,definitions:[l(e,n)]};e.hasOwnProperty("loc")&&(t.loc=e.loc);var d=r[n]||new Set,o=new Set,c=new Set;for(d.forEach((function(e){c.add(e)}));c.size>0;){var m=c;c=new Set,m.forEach((function(e){o.has(e)||(o.add(e),(r[e]||new Set).forEach((function(e){c.add(e)})))}))}return o.forEach((function(n){var r=l(e,n);r&&t.definitions.push(r)})),t}(t,"ads")},351:function(e,n,t){"use strict";var r=t(328);t.n(r).a},352:function(e,n,t){(n=t(48)(!1)).push([e.i,".modAdBanner-1 a{display:inline-block}",""]),e.exports=n},353:function(e,n,t){e.exports=t.p+"img/tx_title_ranking.050733e.svg"},354:function(e,n){var t={kind:"Document",definitions:[{kind:"OperationDefinition",operation:"query",name:{kind:"Name",value:"rankings"}

1,variableDefinitions:[{kind:"VariableDefinition",variable:{kind:"Variable",name:{kind:"Name",value:"rankingType"}},type:{kind:"NonNullType",type:{kind:"NamedType",name:{kind:"Name",value:"Int"}}},directives:[]}],directives:[],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"rankings"},arguments:[{kind:"Argument",name:{kind:"Name",value:"rankingType"},value:{kind:"Variable",name:{kind:"Name",value:"rankingType"}}}],directives:[],selectionSet:{kind:"SelectionSet",selections:[{kind:"Field",name:{kind:"Name",value:"id"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"ranking"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"url"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"thumbnailId"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"categoryUrlPath"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"articleSetId"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"articleSetTitle"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"title"},arguments:[],directives:[]},{kind:"Field",name:{kind:"Name",value:"fromDt"},arguments:[],directives:[]}]}}]}}],loc:{start:0,end:204}};t.loc.source={body:"query rankings($rankingType: Int!) {\n  rankings(rankingType: $rankingType) {\n    id\n    ranking\n    url\n    thumbnailId\n    categoryUrlPath\n    articleSetId\n    articleSetTitle\n    title\n    fromDt\n  }\n}\n",name:"GraphQL request",locationOffset:{line:1,column:1}};var r={};function l(e,n){for(var i=0;i<e.definitions.length;i++){var element=e.definitions[i];if(element.name&&element.name.value==n)return element}}t.definitions.forEach((function(e){if(e.name){var n=new Set;!function e(n,t){if("FragmentSpread"===n.kind)t.add(n.name.value);else if("VariableDefinition"===n.kind){var r=n.type;"NamedType"===r.kind&&t.add(r.name.value)}n.selectionSet&&n.selectionSet.selections.forEach((function(n){e(n,t)})),n.variableDefinitions&&n.variableDefinitions.forEach((function(n){e(n,t)})),n.definitions&&n.definitions.forEach((function(n){e(n,t)}))}(e,n),r[e.name.value]=n}})),e.exports=t,e.exports.rankings=function(e,n){var t={kind:e.kind,definitions:[l(e,n)]};e.hasOwnProperty("loc")&&(t.loc=e.loc);var d=r[n]||new Set,o=new Set,c=new Set;for(d.forEach((function(e){c.add(e)}));c.size>0;){var m=c;c=new Set,m.forEach((function(e){o.has(e)||(o.add(e),(r[e]||new Set).forEach((function(e){c.add(e)})))}))}return o.forEach((function(n){var r=l(e,n);r&&t.definitions.push(r)})),t}(t,"rankings")},410:function(e,n,t){"use strict";t.r(n);t(156),t(96);var r=t(354),l={props:{propRankingType:{default:()=>1,type:Number,required:!0}},data:()=>({IMG_WIDTH:448}),computed:{},watch:{},apollo:{rankings:{prefetch:!0,query:t.n(r).a,variables(){return{rankingType:this.propRankingType}}}},mounted(){},created(){},methods:{getClassFor:(e,n)=>"item rank"+(n+1)+" "+e.categoryUrlPath,getArticleSetUrl(e){return 1===this.propRankingType?new RegExp(/\/[^/]+?\/[^/]+/,"g").exec(e.url)[0]:new RegExp(/\/[^/]+/,"g").exec(e.url)[0]}}},d=t(8),component=Object(d.a)(l,(function(){var e=this,n=e.$createElement,t=e._self._c||n;return t("div",{staticClass:"list"},e._l(e.rankings,(function(n,r){return t("div",{key:r,class:e.getClassFor(n,r)},[t("a",{attrs:{href:n.url}},[t("figure",[n.thumbnailId?t("Img",{staticClass:"ofi-img",attrs:{"prop-width":e.IMG_WIDTH,"prop-id":n.thumbnailId}}):e._e()],1)]),e._v(" "),t("dl",[n.articleSetTitle?t("dt",{staticClass:"tag"},[t("a",{attrs:{href:e.getArticleSetUrl(n)}},[t("span",[e._v(e._s(n.articleSetTitle))])])]):e._e(),e._v(" "),t("dd",[t("a",{attrs:{href:n.url}},[t("p",{staticClass:"title"},[e._v(e._s(n.title))]),e._v(" "),t("p",{staticClass:"update"},[e._v(e._s(n.fromDt))])])])]),e._v("\n    >\n  ")])})),0)}),[],!1,null,null,null);n.default=component.exports;installComponents(component,{Img:t(36).default})}}]);