<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en">
<!--<![endif]-->
<head>
<base href="https://preprod.pioneerdj.com">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0" />
<title>DDJ-FLX10 SPLIT. MIX. CREATE.</title>
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@PioneerDJglobal" />
<meta name="twitter:creator" content="@PioneerDJglobal" />
<meta name="description" content="The DDJ-FLX10 is a 4-channel performance DJ controller for rekordbox and Serato DJ Pro. It includes a host of brand-new features including Track Separation technology, which enables new creative possibilities such as the easy performance of mash-ups on the fly with no need to prepare tracks in advance.
">
<meta property="og:title" content="DDJ-FLX10 SPLIT. MIX. CREATE." />
<meta property="og:site_name" content="Pioneer DJ" />
<meta property="og:url" content="https://preprod.pioneerdj.com/en/product/controller/ddj-flx10/black/overview/" />
<meta property="og:type" content="website" />
<meta property="og:description" content="The DDJ-FLX10 is a 4-channel performance DJ controller for rekordbox and Serato DJ Pro. It includes a host of brand-new features including Track Separation technology, which enables new creative possibilities such as the easy performance of mash-ups on the fly with no need to prepare tracks in advance.
" />
<meta property="og:image" content="https://www.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png" />
<meta property="og:image:width" content="600" />
<meta property="og:image:height" content="315" />
<link rel="canonical" href="https://preprod.pioneerdj.com/en/product/controller/ddj-flx10/black/overview/" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-title" content="Pioneer DJ">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link href="https://plus.google.com/u/0/+pioneerdjglobal" rel="publisher" />
<link href="/Content/img/app/apple-touch-icon-precomposed-152.png" sizes="152x152" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-144.png" sizes="144x144" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-76.png" sizes="76x76" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-72.png" sizes="72x72" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-120.png" sizes="120x120" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-114.png" sizes="114x114" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-57.png" sizes="57x57" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-startup-image-1536x2008.jpg" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-1496x2048.jpg" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-768x1004.jpg" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 1) and (orientation: portrait)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-748x1024.jpg" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 1) and (orientation: landscape)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-1242x2148.jpg" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-1182x2208.jpg" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-750x1294.jpg" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-640x1096.jpg" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-640x920.jpg" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-320x460.jpg" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">
<link href="/Content/css/fonts-default.css" rel="stylesheet" type="text/css">
<link href="https://preprod.pioneerdj.com/-/media/feature/experience-accelerator/bootstrap/bootstrap/styles/bootstrap.css" rel="stylesheet" />
<script type="text/javascript">
function checkForSpecialCharacters(formData, toCheck) {
var errors = {};
toCheck.forEach(function(item) {
if (formData != null && !formData[item].match(new RegExp('^((?![\<,\>,\&,\"]).)*$'))) {
errors[item] = 'This character can not be used.';
}
});
return errors;
}
window.__gigyaConf = {
validation: {
'gigya-register-screen': function(formData, eventType, callback) {
return checkForSpecialCharacters(formData, ['profile.firstName', 'profile.lastName']);
},
'gigya-update-profile-screen': function(formData, eventType, callback) {
var errors = checkForSpecialCharacters(formData, ['profile.nickname', 'profile.firstName', 'profile.lastName', 'profile.city', 'profile.zip']);
if (formData != null && formData['profile.nickname'].length == 0 && !enableEmptyNickname)
errors['profile.nickname'] = "You can not leave this field blank.";
return errors;
}
},
enableSSOToken: true,
bypassCookiePolicy: 'always'
};
</script>
<script type="text/javascript" src="https://cdns.gigya.com/JS/socialize.js?apikey=3_wlzhvsGzBbA5N0X2o1INKsrMGr2b46ppQ-dIKrzCgfT3SnaX6_0071zXz_9KKNOw&lang=en">
{
enabledProviders: 'facebook,twitter,linkedin,yahoo'
}
</script>
<link href="/content/css/gigya/gigya.css?bundleVirtualPath=%7e%2fBundles%2fGigyaStyle%2f" rel="stylesheet" />
<link href="/Content/css/licences.css?bundleVirtualPath=%7e%2fBundles%2fGigyaStyle%2f" rel="stylesheet" />
<link href="/Content/css/ATCare/atc.css?bundleVirtualPath=%7e%2fBundles%2fGigyaStyle%2f" rel="stylesheet" />
<link href="/Content/css/plugins/jquery-ui-1.9.2.custom.min.css?bundleVirtualPath=%7e%2fBundles%2fGigyaStyle%2f" rel="stylesheet" />
<script type="text/javascript" src="//cdn.gigya-ext.com/screenset-validation.min.js"></script>
<script src="/GigyaConnector/Scripts/gigyaconnector_mvc.js?bundleVirtualPath=%7e%2fBundles%2fGigyaConnector%2f"></script>
<script>
(function() {
['main', 'reskin-theme-2020', 'reskin-theme-2022'].forEach(name => {
const link = document.createElement('link');
link.rel = 'stylesheet';
link.href = name.includes('http') ? name : `${window.location.origin}/styles/${name}.css`;
document.head.appendChild(link);
});
}());
</script>
</head>
<body class="header__experience-mode" class="default-device bodyclass">
<!--
<div class="cookies">
<div class="cookies__content">Cookies help us improve your website experience. By using our website, you agree to our use of cookies. <a href="/en/company/cookie-policy/" class="cookies__policy">More information</a></div>
<a href="#" class="cookies__close cookies__trigger"><span class="cookies__icon"><svg class="symbol symbol--close" viewBox="0 0 12 14" version="1" xmlns="http://www.w3.org/2000/svg"><path d="M6.066 5.492L2.372.931A1 1 0 1 0 .818 2.19l3.848 4.752L.418 11.34a1 1 0 0 0 1.439 1.39v-.001l4.077-4.222 3.694 4.561a1 1 0 1 0 1.554-1.259L7.334 7.059l4.248-4.399a1 1 0 0 0-1.439-1.39v.001L6.066 5.492z" fill="currentColor" fill-rule="evenodd"/></svg></span></a>
</div>
-->
<script>
dataLayer = [];
</script>
<!-- Google Tag Manager -->
<noscript>
<iframe src="//www.googletagmanager.com/ns.html?id=GTM-PSC5SC" height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>
<script>
(function(w, d, s, l, i) {
w[l] = w[l] || [];
w[l].push({
'gtm.start': new Date().getTime(),
event: 'gtm.js'
});
var f = d.getElementsByTagName(s)[0],
j = d.createElement(s),
dl = l != 'dataLayer' ? '&l=' + l : '';
j.async = true;
j.src =
'//www.googletagmanager.com/gtm.js?id=' + i + dl;
f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'dataLayer', 'GTM-PSC5SC');
</script>
<!-- End Google Tag Manager -->
<!-- #wrapper -->
<head>
<style>
</style>
</head>
<div class="brand-bar">
<div class="brand-bar__inner">
<a href="https://alphatheta.com" target="_blank" class="brand-bar__logo">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 117 18.7" width="117" height="18.7">
<title>AlphaTheta</title>
<path fill="currentColor" d="m32.28 2.62 4.89 12.69h-2.38l-1.19-3.36h-5.06l-1.19 3.36h-2.29l4.87-12.69h2.36ZM31.05 4.8l-1.92 5.45H33L31.1 4.8h-.05Zm9.47-2.18v12.69h-2.03V2.62h2.03Zm11.18 8.14c0 2.42-1.21 4.8-3.96 4.8-1.15 0-2.45-.41-3.07-1.44h-.04v4.58H42.6V6.12h1.92v1.24h.04c.59-1.07 1.67-1.49 2.84-1.49 2.88 0 4.3 2.2 4.3 4.89Zm-4.57 3.19c1.83 0 2.54-1.63 2.54-3.23s-.76-3.25-2.56-3.25c-1.88 0-2.56 1.6-2.56 3.25s.78 3.23 2.58 3.23Zm7.95-11.33v4.71h.04c.59-.92 1.62-1.46 2.77-1.46 2.11 0 3.23 1.23 3.23 3.06v6.38h-2.03V9.62c0-1.17-.36-2.15-1.79-2.15s-2.22 1.16-2.22 2.36v5.47h-2.03V2.62h2.03Zm15.69 5.86v4.83c0 .48.11.64.55.64.11 0 .28 0 .43-.04v1.4c-.52.14-1.05.23-1.28.23-.89 0-1.42-.36-1.56-1.12-.73.73-2.06 1.12-3.18 1.12-1.81 0-3.15-1-3.15-2.68s1.01-2.4 2.38-2.68c.69-.14 1.46-.23 2.31-.34 1.23-.14 1.6-.43 1.6-1.14 0-.8-.64-1.24-1.9-1.24s-1.94.53-2.03 1.46h-2.03c.14-2.01 1.6-3.06 4.18-3.06 2.22 0 3.68 1.05 3.68 2.61Zm-4.43 5.47c1.39 0 2.4-.69 2.4-1.69V10.7c-.55.34-.82.34-2.22.52-1.33.16-1.92.64-1.92 1.47 0 .76.64 1.26 1.74 1.26ZM81.41 2.62v1.92h-4.03v10.77h-2.22V4.54h-4.02V2.62h10.27Zm3.04 0v4.71h.04c.59-.92 1.62-1.46 2.77-1.46 2.11 0 3.23 1.23 3.23 3.06v6.38h-2.03V9.62c0-1.17-.36-2.15-1.79-2.15s-2.22 1.16-2.22 2.36v5.47h-2.03V2.62h2.03Zm16.19 7.92c0 .23-.02.46-.04.69h-6.75c0 1.51.87 2.72 2.47 2.72 1.12 0 1.87-.46 2.24-1.53h1.92c-.41 1.97-2.15 3.13-4.16 3.13-2.9 0-4.5-2.03-4.5-4.82s1.71-4.87 4.44-4.87c2.59 0 4.37 2.13 4.37 4.67Zm-2.07-.64c-.11-1.28-.94-2.43-2.33-2.43s-2.33 1.08-2.4 2.43h4.73Zm6.21-6.54v2.75h1.83v1.51h-1.83v5.01c0 .96.23 1.16 1.01 1.16.37 0 .75-.04.82-.07v1.56c-.8.09-1.03.11-1.31.11-1.94 0-2.54-.62-2.54-2.47V7.63h-1.53V6.12h1.53V3.37h2.03Zm11.24 5.12v4.83c0 .48.11.64.55.64.11 0 .28 0 .43-.04v1.4c-.52.14-1.05.23-1.28.23-.89 0-1.42-.36-1.56-1.12-.73.73-2.06 1.12-3.18 1.12-1.81 0-3.14-1-3.14-2.68s1.01-2.4 2.38-2.68c.69-.14 1.46-.23 2.31-.34 1.23-.14 1.6-.43 1.6-1.14 0-.8-.64-1.24-1.9-1.24s-1.94.53-2.03 1.46h-2.03c.14-2.01 1.6-3.06 4.18-3.06 2.22 0 3.68 1.05 3.68 2.61Zm-4.42 5.47c1.39 0 2.4-.69 2.4-1.69V10.7c-.55.34-.82.34-2.22.52-1.33.16-1.92.64-1.92 1.47 0 .76.64 1.26 1.74 1.26ZM18.46 1.35C15.26-1.26 10.62.22 7.85 3.19c-.37.4-.71.84-1.03 1.3 1.61-2.12 4.01-3.46 6.35-3.28 3.44.26 5.42 3.69 4.44 7.66-.98 3.97-4.56 6.98-8 6.72-3.08-.23-4.99-3-4.65-6.43 1.03-.57 2.18-.78 3.21-.51 2.02.54 2.86 2.75 1.95 5 .29-.64.49-1.31.55-1.96.03-.29.03-.58 0-.88-.18-2.24-1.97-4.18-4.93-3.68-4.78.81-7.31 6.14-4.68 9.28 1.61 1.91 4.48 1.63 6.52.27 1.58 1.12 3.75 1.51 6.26.58 7.28-2.69 9.66-11.77 4.61-15.9ZM4.31 17.12c-2.09-.56-2.92-2.91-1.85-5.25.53-1.16 1.43-2.1 2.45-2.68-.14.81-.18 1.62-.11 2.39l.06.53c.04.29.11.57.18.85.41 1.48 1.26 2.79 2.46 3.66-1.02.56-2.17.77-3.2.5Z" />
</svg>
</a>
</div>
</div>
<header class="header theme-2020">
<div class="header__inner">
<div class="header__in">
<div class="header__content">
<a class="header__trigger">
<span class="menuIcon">
<span class="menuIcon__inner">
<span class="menuIcon__bar"></span>
</span>
</span>
</a>
<a href="/en" class="header__logo">
<svg class="logo" viewBox="0 0 162 24">
<path fill="currentColor" d="M0.473684,17.4307148 C0.579569432,17.1848501 0.698235535,16.9437641 0.789479818,16.6922965 C1.87583685,13.6974261 2.91592461,10.6841817 4.05534569,7.71048668 C4.90242914,5.49976344 6.20630025,3.59941977 8.17961966,2.24650428 C9.69857813,1.20512189 11.3954144,0.661813437 13.190856,0.420397944 C15.7630065,0.0745887887 18.3244794,0.0844761127 20.8489855,0.788618366 C22.2919879,1.19119724 23.6403487,1.79498315 24.7815494,2.80909301 C26.5363032,4.368324 26.8715935,6.53200006 25.6374499,8.54851977 C24.5467248,10.3306275 22.8971284,11.3381458 20.9601288,11.9074085 C19.015121,12.4789782 17.0231968,12.5165501 15.0270663,12.3595064 C13.9411946,12.2740634 12.8634929,12.0838148 11.7807759,11.9516543 C11.5280745,11.9208388 11.4294692,11.8103479 11.3770523,11.548993 C11.1423895,10.3808881 10.8774737,9.21904513 10.6246105,8.05473034 C10.608028,7.97818597 10.6009906,7.89949935 10.5819004,7.77022259 C11.3133916,7.90600851 12.0066217,8.05028104 12.7049478,8.16118386 C14.5081549,8.44775146 16.3230102,8.64722823 18.1302618,8.27043879 C18.8015705,8.13053315 19.489381,7.88021907 20.0679085,7.51364654 C21.0733752,6.87665569 21.0450636,5.84878597 20.0862706,5.13137823 C19.3807452,4.60339513 18.5590614,4.38200146 17.7106028,4.286424 C16.1727968,4.11314865 14.6387119,4.15690006 13.142888,4.59869865 C11.2513488,5.15741485 10.0399353,6.4699571 9.37493595,8.31509654 C8.30863972,11.2737958 7.2682284,14.2421353 6.23307494,17.2122874 C6.12848376,17.5123677 5.99339692,17.5997881 5.6893302,17.5973986 C3.95091628,17.5836388 2.2122597,17.5936085 0.473684,17.5955036 L0.473684,17.4307148 Z M144.134896,23.4455036 C144.263188,23.0177944 144.379913,22.5860479 144.523008,22.1635296 C144.658418,21.7637522 144.719491,21.2336268 145.002041,21.0203902 C145.264691,20.822067 145.776646,20.9725191 146.178429,20.9582648 C147.407072,20.9147606 148.621235,20.783012 149.778938,20.3209444 C151.098501,19.7942796 152.044352,18.9259254 152.517803,17.5087423 C153.219122,15.4094163 154.00028,13.3378571 154.747221,11.2543508 C154.788718,11.1385867 154.837171,11.0243881 154.867343,10.905493 C155.070621,10.1037958 154.81614,9.76655569 154.011038,9.76556696 C153.611198,9.76507259 153.211357,9.76548456 152.752304,9.76548456 C153.010749,9.0468409 153.237889,8.37680992 153.502319,7.72243386 C153.540257,7.62858668 153.758013,7.56423668 153.892858,7.56374231 C156.343754,7.55443175 158.794649,7.55715076 161.245545,7.55640921 C161.339135,7.55640921 161.432725,7.54792259 161.526316,7.5433909 L161.526316,7.62578527 C161.471067,7.74772893 161.406841,7.86637682 161.361785,7.99202823 C160.098601,11.5162001 158.843345,15.0432557 157.573529,18.5648733 C156.854171,20.5600529 155.527813,21.9629817 153.539771,22.6505627 C152.830929,22.8957684 152.089489,23.0665719 151.349828,23.1899163 C150.543594,23.3243839 149.722234,23.3643451 148.907425,23.4455036 L144.134896,23.4455036 Z M51.5382237,17.5893652 C51.5674251,17.4705525 51.5818236,17.3771173 51.6131281,17.2899441 C52.2370352,15.5529884 52.8507501,13.8120779 53.4914014,12.081549 C54.2081706,10.1456934 55.556046,8.80966872 57.4318926,8.08097294 C60.2206673,6.99756942 63.1014953,6.81382999 66.0073992,7.48377858 C66.7103361,7.6458483 67.4068827,7.99709548 68.0115378,8.40651308 C69.2295034,9.2311159 69.6623475,10.5760391 69.1913232,11.9860539 C68.5892565,13.7884307 67.9219113,15.5683138 67.2713105,17.3536349 C67.2353952,17.452261 67.0962638,17.5784891 67.0042106,17.5793131 C65.3751604,17.5929905 63.7459485,17.5892004 62.0644813,17.5892004 C62.1238548,17.3997758 62.1659178,17.2462751 62.219629,17.0970589 C62.7707347,15.5664187 63.3249143,14.0369321 63.8756965,12.5061272 C64.2703604,11.409211 63.9089425,10.680268 62.8011495,10.3293504 C61.0318355,9.76882154 59.1163526,10.732506 58.4799076,12.5035729 C57.9112486,14.0860391 57.3471195,15.670318 56.7666506,17.2482525 C56.7170648,17.3830497 56.5604611,17.5734631 56.4515828,17.5748638 C54.8226134,17.5958744 53.1933206,17.5893652 51.5382237,17.5893652 Z M121.667909,7.59000963 C121.637251,7.71533146 121.61986,7.81923076 121.586371,7.91752724 C121.326471,8.68115823 121.053789,9.44042231 120.807074,10.2084202 C120.730632,10.4464575 120.616901,10.5212716 120.374715,10.5180582 C119.350886,10.5044632 118.326896,10.5121258 117.302986,10.512373 C116.011572,10.512785 115.466128,10.8716125 115.017268,12.1065392 C114.405737,13.789197 113.815481,15.4802589 113.244395,17.1775005 C113.130016,17.5174596 112.968963,17.6011723 112.640468,17.5972174 C111.2261,17.5799146 109.811329,17.5898019 108.396638,17.5898019 L107.956675,17.5898019 C108.025756,17.3778012 108.076798,17.2111174 108.134149,17.0467406 C108.813708,15.0977019 109.491488,13.1479216 110.175416,11.200366 C110.771173,9.50403076 111.793061,8.22922513 113.578391,7.76765189 C114.069314,7.64076456 114.588145,7.57666175 115.095085,7.5714709 C117.183106,7.54996597 119.271533,7.56191315 121.359797,7.56306668 C121.450556,7.56314907 121.541315,7.57847442 121.667909,7.59000963 Z M32.9509623,7.56188844 C32.8881106,7.76762717 32.8512246,7.90951027 32.8018815,8.04677928 C31.7063029,11.0962772 30.605871,14.1440448 29.5185433,17.1965913 C29.4179966,17.478792 29.3016763,17.6023835 28.9828876,17.5985934 C27.3666989,17.5794779 25.7501867,17.5897772 24.0724406,17.5897772 C24.1150698,17.4335575 24.1403075,17.30873 24.182775,17.1902469 C25.2903253,14.1014469 26.4032143,11.014542 27.5025947,7.92261097 C27.6017662,7.64370604 27.7342646,7.5521659 28.0243373,7.55480252 C29.6403641,7.56955111 31.2566336,7.56188844 32.9509623,7.56188844 Z M87.8546861,14.107989 C87.5032177,15.0957327 87.1847525,16.0267066 86.8319898,16.9439207 C86.7777124,17.0849798 86.5805827,17.2158221 86.4240599,17.2622101 C83.9920924,17.9836552 81.5022074,18.1658291 78.9844152,18.048582 C77.1835539,17.9647869 75.4219245,17.6726989 73.7579297,16.9281834 C72.7478522,16.4761679 71.8323356,15.8824341 71.1391055,14.9849122 C70.2171985,13.7912651 70.0986942,12.5294777 70.8271115,11.1906517 C71.4368628,10.0698411 72.3577991,9.2905552 73.4447224,8.69434956 C74.9737112,7.85565731 76.6277565,7.44459182 78.3405282,7.25557914 C80.92643,6.97032985 83.4573264,7.21421717 85.8778884,8.21728618 C86.5673976,8.50302985 87.2089387,8.93304604 87.8263745,9.36520449 C88.1598044,9.59862773 88.4403321,9.94649675 88.666097,10.2954369 C89.0783949,10.9325925 89.0028434,11.6278362 88.4240731,12.1070418 C87.9935748,12.4634798 87.4896281,12.7607587 86.9738714,12.9710291 C85.6115975,13.5262848 84.1614767,13.702032 82.7132164,13.8467989 C80.5668726,14.0613538 78.4290222,14.0390249 76.3476334,13.3813531 C75.6353132,13.1562517 74.9579376,12.8162101 74.2425436,12.5195904 C74.1901267,13.0226904 74.4040816,13.4319432 74.7463285,13.7818721 C75.3382839,14.3871411 76.0976014,14.6709073 76.8853922,14.8757397 C78.8454456,15.3855136 80.8345386,15.3721658 82.8287277,15.1679101 C84.4676466,14.9999904 86.0738048,14.6629151 87.6405695,14.139546 C87.6882947,14.1236439 87.7413588,14.1240559 87.8546861,14.107989 Z M76.1337593,10.5573686 C76.4599091,10.6776644 76.6821148,10.7740658 76.9123287,10.8420411 C78.4008724,11.2816975 79.9273537,11.413858 81.4675054,11.3630207 C82.0825954,11.3427517 82.699465,11.2488221 83.30501,11.1317397 C83.4903297,11.0959805 83.640543,10.8717855 83.8068535,10.7338573 C83.6559122,10.5780496 83.5222005,10.396782 83.348529,10.2745911 C83.2103683,10.1773658 83.0272326,10.1290003 82.857282,10.0993383 C82.2347501,9.99066013 81.61238,9.86484393 80.9845093,9.80741506 C79.349635,9.65795168 77.7675821,9.91395097 76.1337593,10.5573686 Z M107.321719,14.1033008 C106.96386,15.0987895 106.636254,16.0414634 106.277829,16.9717782 C106.227758,17.1017141 106.040173,17.2183022 105.8936,17.261724 C103.460824,17.9814388 100.970696,18.1655902 98.4523376,18.0493317 C96.7199904,17.9693268 95.0233159,17.6933057 93.4100393,17.0115747 C92.4814993,16.6191303 91.6282682,16.1042479 90.9228237,15.360062 C89.6065764,13.9714698 89.463077,12.4106733 90.5182912,10.8057958 C91.2712992,9.66059654 92.3422871,8.91245569 93.5579068,8.36906485 C95.786597,7.37266977 98.1353284,7.05981837 100.547154,7.17368738 C102.116669,7.24775992 103.665638,7.50178175 105.114303,8.13094513 C105.922316,8.48186273 106.664404,8.99592118 107.418949,9.46532189 C107.630154,9.5967409 107.797354,9.81665146 107.954686,10.0201655 C108.61103,10.8696515 108.505953,11.6807416 107.653126,12.3323986 C106.949138,12.8704339 106.129395,13.1476909 105.284496,13.3372803 C102.471131,13.9685036 99.6333363,14.2521874 96.789637,13.623024 C95.8297115,13.4106113 94.9228501,12.9491205 93.9926114,12.598862 C93.9083237,12.5671402 93.8309117,12.5166325 93.7080393,12.4529416 C93.6564313,13.0130585 93.8618927,13.4231353 94.199448,13.7720754 C94.7884913,14.3809698 95.5478897,14.6668782 96.3356805,14.8727817 C98.2954912,15.3849451 100.285312,15.3733275 102.279825,15.1693191 C103.918744,15.0017289 105.526115,14.6686909 107.092314,14.1412022 C107.141495,14.1246409 107.195692,14.1234874 107.321719,14.1033008 Z M95.5932691,10.5591895 C95.9362441,10.6836874 96.156832,10.7954141 96.3899579,10.8426261 C97.2063839,11.0079916 98.0217584,11.2026071 98.8474059,11.2906043 C100.106464,11.4247423 101.376765,11.4752501 102.622395,11.1677543 C102.862963,11.1083479 103.06252,10.8760782 103.281004,10.7235663 C103.074411,10.5492198 102.891518,10.2781423 102.656774,10.2184888 C101.942512,10.0368092 101.212882,9.88973527 100.480743,9.81450921 C98.8343017,9.64518879 97.2397916,9.91000428 95.5932691,10.5591895 Z M41.7343085,18.0901499 C39.6459631,18.0575217 37.5680525,17.7452471 35.6290306,16.7702746 C34.7506426,16.3285584 33.9591308,15.7658048 33.353424,14.9648492 C32.4224573,13.733795 32.3618705,12.3265816 33.1906727,11.0221964 C33.8160358,10.0380781 34.7030791,9.35024992 35.7022363,8.81180273 C38.1368732,7.49967245 40.7573152,7.06413583 43.4805688,7.17586259 C45.3403182,7.25215977 47.1424737,7.60777386 48.8291987,8.44926752 C49.6471616,8.85728442 50.3894112,9.37200203 50.9883232,10.0814175 C52.1241042,11.4270823 52.1870369,13.0236379 51.1427428,14.4531802 C50.2692891,15.6488048 49.0575521,16.3785717 47.7362896,16.939595 C45.8319696,17.7483781 43.8334933,18.0646901 41.7343085,18.0901499 Z M42.2525728,14.9727591 C42.5803404,14.9257943 43.0931042,14.8878929 43.5888001,14.7731999 C44.3976224,14.5860823 45.1589621,14.2730661 45.7381368,13.6307196 C46.3948854,12.9024358 46.3660075,12.0051612 45.6552242,11.3362013 C45.4505717,11.1435633 45.2166369,10.9399668 44.9599719,10.8561717 C44.2868836,10.6365084 43.6031177,10.4020964 42.906652,10.3162415 C41.7787173,10.1771598 40.6772338,10.3890781 39.6610896,10.9299147 C39.3555668,11.0924788 39.0599936,11.3045619 38.8160284,11.5514978 C38.0607555,12.3157879 38.106782,13.294221 38.9275761,13.9847682 C39.8373496,14.7501295 40.9356784,14.9218394 42.2525728,14.9727591 Z M128.251046,17.6288651 C128.739462,16.2691108 129.192529,15.0110313 129.643411,13.7521277 C131.03068,9.87835661 132.420942,6.005739 133.796725,2.12776576 C133.911185,1.80510942 134.061317,1.69980942 134.398953,1.70368196 C137.524313,1.73952351 140.650481,1.72905942 143.775355,1.78896013 C145.31397,1.81845731 146.84215,2.03523689 148.263878,2.69117844 C149.880795,3.43725942 151.119387,4.56334323 151.530553,6.40765872 C151.850474,7.842639 151.492939,9.18616154 150.863531,10.4624503 C149.757356,12.7053897 147.965393,14.2498721 145.855692,15.4478862 C143.628054,16.7128869 141.208301,17.3809404 138.682419,17.4772594 C135.237867,17.6086784 131.787571,17.5849489 128.251046,17.6288651 Z M136.249967,15.1384953 C136.625702,15.106032 137.002651,15.0846094 137.37685,15.0392925 C139.387217,14.7957348 141.3027,14.2292735 142.912255,12.9463932 C144.623571,11.5823545 145.690191,9.81927985 145.587136,7.50539886 C145.508754,5.7453728 144.566139,4.59621858 142.869222,4.33576999 C141.850651,4.17938548 140.804092,4.18960238 139.769262,4.17089886 C138.666241,4.15104182 138.452853,4.31179323 138.070484,5.36504041 C137.085806,8.07680379 136.112777,10.7929341 135.135217,13.5073341 C134.677297,14.7788439 134.925307,15.1386601 136.249967,15.1384953 Z"></path>
</svg>
</a>
<span class="header__overlay header__trigger--close"></span>
<div class="header__nav">
<div class="header__nav__inner">
<div class="header__mainNav">
<style>
.megaMenu_btnlist {
display: flex;
text-align: center;
}
.megaMenu_btn {
margin-right: var(--gap--8);
}
.button__label {
padding-inline: 10px;
}
/* Responsive layout - makes a one column-layout instead of a row */
@media (max-width: 800px) {
.megaMenu_btnlist {
flex-direction: column;
}
.megaMenu_btn {
margin-bottom: var(--gap--8);
}
}
</style>
<nav class="mainNav">
<ul class="mainNav__list">
<li class="mainNav__item">
<a href="/en/" class="mainNav__link">Home</a>
</li>
<li class="mainNav__item">
<section class="megaMenu">
<a class="mainNav__link megaMenu__trigger">Products</a>
<span class="megaMenu__icon megaMenu__trigger"></span>
<div class="megaMenu__target">
<div class="megaMenu__inner">
<div class="megaMenu__links">
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/product/player/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M31.77 28.6c-8.23 0-14.9 6.67-14.9 14.9s6.67 14.9 14.9 14.9 14.9-6.67 14.9-14.9S40 28.6 31.77 28.6Zm0 27.79c-7.11 0-12.9-5.79-12.9-12.9s5.79-12.9 12.9-12.9 12.9 5.79 12.9 12.9-5.79 12.9-12.9 12.9Z" />
<path fill="currentColor" d="M31.77 37.6c-3.26 0-5.9 2.64-5.9 5.9s2.64 5.9 5.9 5.9 5.9-2.64 5.9-5.9-2.64-5.9-5.9-5.9Zm0 9.79c-2.15 0-3.9-1.75-3.9-3.9s1.75-3.9 3.9-3.9 3.9 1.75 3.9 3.9-1.75 3.9-3.9 3.9ZM16.02 23.73h4v2h-4zM23.02 23.73h4v2h-4zM30.02 23.73h4v2h-4zM37.02 23.73h4v2h-4zM44.02 23.73h4v2h-4z" />
<circle cx="14.72" cy="57.02" r="2" fill="currentColor" />
<circle cx="14.72" cy="50.18" r="2" fill="currentColor" />
<path fill="currentColor" d="M47.68 48.05h2v1h-2zM47.68 46.05h2v1h-2zM47.68 50.05h2v1h-2zM46.68 52.05h4v1h-4zM47.68 54.05h2v1h-2zM47.68 56.05h2v1h-2zM47.68 58.05h2v1h-2z" />
<path fill="currentColor" d="M47.77 5.48v-4h-32v4h-7v57.6h46V5.48h-7Zm-30 0v-2h28v16h-28v-14Zm35 55.6h-42V7.48h5v14h32v-14h5v53.6Z" />
<circle cx="13.88" cy="30.11" r="1" fill="currentColor" />
<circle cx="17.88" cy="30.11" r="1" fill="currentColor" />
</svg>
</span>DJ Players / Turntables</a>
</li>
<li class="megaMenu__item">
<a href="/en/product/mixer/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<circle cx="13.56" cy="26.23" r="1" fill="currentColor" />
<circle cx="13.56" cy="22.23" r="1" fill="currentColor" />
<circle cx="13.56" cy="18.23" r="1" fill="currentColor" />
<path fill="currentColor" d="M56.61 3.16H7.53V61.4h49.08V3.16Zm-2 17.94h-6v-4h6v4Zm0 38.3H9.53V5.16h45.08v9.94h-8v14h8v30.3Zm0-32.3h-6v-4h6v4Z" />
<path fill="currentColor" d="M27.57 54.24h1v2h-1zM25.57 54.24h1v2h-1zM29.57 54.24h1v2h-1zM31.57 53.24h1v4h-1zM33.57 54.24h1v2h-1zM35.57 54.24h1v2h-1zM37.57 54.24h1v2h-1z" />
<circle cx="13.56" cy="41.47" r="2" fill="currentColor" />
<circle cx="13.56" cy="48.35" r="2" fill="currentColor" />
<path fill="currentColor" d="M19.64 45.45h4v1h-4zM19.64 43.45h4v1h-4zM19.64 35.36h4v2h-4zM19.64 39.36h4v2h-4zM19.64 47.45h4v1h-4zM19.64 49.45h4v1h-4z" />
<circle cx="21.54" cy="26.23" r="1" fill="currentColor" />
<circle cx="21.54" cy="22.23" r="1" fill="currentColor" />
<circle cx="21.54" cy="18.23" r="1" fill="currentColor" />
<circle cx="21.54" cy="14.23" r="1" fill="currentColor" />
<circle cx="21.54" cy="9.23" r="1" fill="currentColor" />
<circle cx="21.54" cy="31.29" r="2" fill="currentColor" />
<path fill="currentColor" d="M26.65 45.45h4v1h-4zM26.65 43.45h4v1h-4zM26.65 35.36h4v2h-4zM26.65 39.36h4v2h-4zM26.65 47.45h4v1h-4zM26.65 49.45h4v1h-4z" />
<circle cx="28.55" cy="26.23" r="1" fill="currentColor" />
<circle cx="28.55" cy="22.23" r="1" fill="currentColor" />
<circle cx="28.55" cy="18.23" r="1" fill="currentColor" />
<circle cx="28.55" cy="14.23" r="1" fill="currentColor" />
<circle cx="28.55" cy="9.23" r="1" fill="currentColor" />
<circle cx="28.55" cy="31.29" r="2" fill="currentColor" />
<path fill="currentColor" d="M33.62 45.45h4v1h-4zM33.62 43.45h4v1h-4zM33.62 35.36h4v2h-4zM33.62 39.36h4v2h-4zM33.62 47.45h4v1h-4zM33.62 49.45h4v1h-4z" />
<circle cx="35.53" cy="26.23" r="1" fill="currentColor" />
<circle cx="35.53" cy="22.23" r="1" fill="currentColor" />
<circle cx="35.53" cy="18.23" r="1" fill="currentColor" />
<circle cx="35.53" cy="14.23" r="1" fill="currentColor" />
<circle cx="35.53" cy="9.23" r="1" fill="currentColor" />
<circle cx="35.53" cy="31.29" r="2" fill="currentColor" />
<path fill="currentColor" d="M40.6 45.45h4v1h-4zM40.6 43.45h4v1h-4zM40.6 35.36h4v2h-4zM40.6 39.36h4v2h-4zM40.6 47.45h4v1h-4zM40.6 49.45h4v1h-4z" />
<circle cx="42.5" cy="26.23" r="1" fill="currentColor" />
<circle cx="42.5" cy="22.23" r="1" fill="currentColor" />
<circle cx="42.5" cy="18.23" r="1" fill="currentColor" />
<circle cx="42.5" cy="14.23" r="1" fill="currentColor" />
<circle cx="42.5" cy="9.23" r="1" fill="currentColor" />
<circle cx="42.5" cy="31.29" r="2" fill="currentColor" />
<circle cx="50.56" cy="55.3" r="1" fill="currentColor" />
<circle cx="13.56" cy="55.3" r="1" fill="currentColor" />
<circle cx="50.56" cy="51.3" r="1" fill="currentColor" />
<circle cx="50.56" cy="47.3" r="1" fill="currentColor" />
<circle cx="50.56" cy="43.3" r="1" fill="currentColor" />
<circle cx="50.56" cy="39.3" r="1" fill="currentColor" />
<circle cx="50.56" cy="35.3" r="1" fill="currentColor" />
</svg>
</span>DJ mixers</a>
</li>
<li class="megaMenu__item">
<a href="/en/product/all-in-one-system/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M54.02 17.44v-6.58h-6.01V8.4H16.23v9.04H1.03v38.73h62V17.44h-9.01Zm-35.78 0V10.4h27.77v14H18.23v-6.96Zm33.78 4.49h-3.98v-9.07h3.98v9.07Zm9.01 32.24h-58V19.44h13.21v6.96h31.77v-2.46h6.01v-4.49h7.01v34.72Z" />
<path fill="currentColor" d="M27.46 49.26h1v2h-1zM29.46 49.26h1v2h-1zM27.3 41.75h2v1h-2zM27.3 43.75h2v1h-2zM27.3 45.75h2v1h-2zM31.46 48.26h1v4h-1zM33.46 49.26h1v2h-1zM35.46 49.26h1v2h-1z" />
<circle cx="28.3" cy="31.16" r="1" fill="currentColor" />
<circle cx="28.3" cy="34.17" r="1" fill="currentColor" />
<circle cx="28.3" cy="38.17" r="2" fill="currentColor" />
<path fill="currentColor" d="M34.75 41.75h2v1h-2zM34.75 43.75h2v1h-2zM34.75 45.75h2v1h-2z" />
<circle cx="35.75" cy="31.16" r="1" fill="currentColor" />
<circle cx="35.75" cy="34.17" r="1" fill="currentColor" />
<circle cx="35.75" cy="38.17" r="2" fill="currentColor" />
<path fill="currentColor" d="M9.95 45.26h2v2h-2zM13.95 45.26h2v2h-2zM17.95 45.26h2v2h-2zM9.95 49.26h2v2h-2zM13.95 49.26h2v2h-2zM17.95 49.26h2v2h-2zM21.95 45.26h2v2h-2zM56.67 22.39h2v2h-2zM21.95 49.26h2v2h-2z" />
<circle cx="6.6" cy="49.69" r="1.5" fill="currentColor" />
<circle cx="6.6" cy="44.69" r="1.5" fill="currentColor" />
<path fill="currentColor" d="M45 45.26h2v2h-2zM49 45.26h2v2h-2zM53 45.26h2v2h-2zM45 49.26h2v2h-2zM49 49.26h2v2h-2zM53 49.26h2v2h-2zM57 45.26h2v2h-2zM57 49.26h2v2h-2z" />
<circle cx="41.64" cy="49.69" r="1.5" fill="currentColor" />
<circle cx="41.64" cy="44.69" r="1.5" fill="currentColor" />
<path fill="currentColor" d="M14.79 27.99c-4.2 0-7.61 3.41-7.61 7.61s3.41 7.61 7.61 7.61 7.61-3.41 7.61-7.61-3.41-7.61-7.61-7.61Zm0 13.22c-3.09 0-5.61-2.52-5.61-5.61s2.52-5.61 5.61-5.61 5.61 2.52 5.61 5.61-2.52 5.61-5.61 5.61Z" />
<circle cx="14.79" cy="35.6" r="2" fill="currentColor" />
<path fill="currentColor" d="M41.79 35.6c0 4.2 3.41 7.61 7.61 7.61s7.61-3.41 7.61-7.61-3.41-7.61-7.61-7.61-7.61 3.41-7.61 7.61Zm13.22 0c0 3.09-2.52 5.61-5.61 5.61s-5.61-2.52-5.61-5.61 2.52-5.61 5.61-5.61 5.61 2.52 5.61 5.61Z" />
<circle cx="49.4" cy="35.6" r="2" fill="currentColor" />
<circle cx="7.24" cy="23.61" r="1" fill="currentColor" />
<circle cx="11.24" cy="23.61" r="1" fill="currentColor" />
</svg>
</span>All-in-one DJ systems</a>
</li>
<li class="megaMenu__item">
<a href="/en/product/controller/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M.99 12.91v38.73h62V12.91h-62Zm60 36.73h-58V14.91h58v34.73Z" />
<path fill="currentColor" d="M14.11 38.68c4.42 0 8-3.58 8-8s-3.58-8-8-8-8 3.58-8 8 3.58 8 8 8Zm0-14c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6 2.69-6 6-6ZM27.49 44.74h1v2h-1zM29.49 44.74h1v2h-1zM31.49 43.74h1v4h-1zM33.49 44.74h1v2h-1zM35.49 44.74h1v2h-1zM24.99 35.68h2v1h-2zM24.99 37.68h2v1h-2zM24.99 39.68h2v1h-2z" />
<circle cx="25.99" cy="19.09" r="1" fill="currentColor" />
<circle cx="19.99" cy="20.09" r="2" fill="currentColor" />
<circle cx="25.99" cy="22.1" r="1" fill="currentColor" />
<circle cx="25.99" cy="25.1" r="1" fill="currentColor" />
<circle cx="25.99" cy="28.1" r="1" fill="currentColor" />
<path fill="currentColor" d="M28.99 35.68h2v1h-2zM28.99 37.68h2v1h-2zM28.99 39.68h2v1h-2z" />
<circle cx="29.99" cy="19.09" r="1" fill="currentColor" />
<circle cx="29.99" cy="22.1" r="1" fill="currentColor" />
<circle cx="29.99" cy="25.1" r="1" fill="currentColor" />
<circle cx="29.99" cy="28.1" r="1" fill="currentColor" />
<path fill="currentColor" d="M32.99 35.68h2v1h-2zM32.99 37.68h2v1h-2zM32.99 39.68h2v1h-2z" />
<circle cx="33.99" cy="19.09" r="1" fill="currentColor" />
<circle cx="33.99" cy="22.1" r="1" fill="currentColor" />
<circle cx="33.99" cy="25.1" r="1" fill="currentColor" />
<circle cx="33.99" cy="28.1" r="1" fill="currentColor" />
<path fill="currentColor" d="M36.99 35.68h2v1h-2zM36.99 37.68h2v1h-2zM36.99 39.68h2v1h-2z" />
<circle cx="37.99" cy="19.09" r="1" fill="currentColor" />
<circle cx="37.99" cy="22.1" r="1" fill="currentColor" />
<circle cx="37.99" cy="25.1" r="1" fill="currentColor" />
<circle cx="37.99" cy="28.1" r="1" fill="currentColor" />
<circle cx="25.99" cy="32.1" r="1" fill="currentColor" />
<circle cx="29.99" cy="32.1" r="1" fill="currentColor" />
<circle cx="33.99" cy="32.1" r="1" fill="currentColor" />
<circle cx="37.99" cy="32.1" r="1" fill="currentColor" />
<path fill="currentColor" d="M9.91 40.74h2v2h-2zM13.91 40.74h2v2h-2zM17.91 40.74h2v2h-2zM9.91 44.74h2v2h-2zM13.91 44.74h2v2h-2zM17.91 44.74h2v2h-2zM52.63 17.87h2v2h-2zM56.63 17.87h2v2h-2z" />
<circle cx="6.55" cy="45.17" r="1.5" fill="currentColor" />
<circle cx="6.55" cy="40.17" r="1.5" fill="currentColor" />
<path fill="currentColor" d="M46.96 40.74h2v2h-2zM50.96 40.74h2v2h-2zM54.96 40.74h2v2h-2zM46.96 44.74h2v2h-2zM50.96 44.74h2v2h-2zM54.96 44.74h2v2h-2z" />
<circle cx="43.6" cy="45.17" r="1.5" fill="currentColor" />
<circle cx="43.6" cy="40.17" r="1.5" fill="currentColor" />
<circle cx="14.11" cy="30.68" r="2.1" fill="currentColor" />
<path fill="currentColor" d="M50.22 38.68c4.42 0 8-3.58 8-8s-3.58-8-8-8-8 3.58-8 8 3.58 8 8 8Zm0-14c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6 2.69-6 6-6Z" />
<circle cx="50.22" cy="30.68" r="2.1" fill="currentColor" />
<circle cx="7.2" cy="19.09" r="1" fill="currentColor" />
<circle cx="11.2" cy="19.09" r="1" fill="currentColor" />
<circle cx="44.03" cy="19.09" r="1" fill="currentColor" />
<circle cx="48.03" cy="19.09" r="1" fill="currentColor" />
</svg>
</span>DJ controllers</a>
</li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/product/software/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M50.95 30.94h2v4h-2zM46.95 30.94h2v4h-2zM42.95 28.94h2v8h-2zM38.95 26.94h2v12h-2zM34.95 30.94h2v4h-2zM30.95 28.94h2v8h-2zM26.95 26.94h2v12h-2zM22.95 30.94h2v4h-2zM18.95 28.94h2v8h-2zM14.95 26.94h2v12h-2zM10.95 30.94h2v4h-2z" />
<path fill="currentColor" d="M56.84 46.97h.02V17.51c0-1.1-.9-2-2-2H9.03c-1.1 0-2 .9-2 2v29.45H1.9v2h60.09v-2h-5.15ZM9.03 17.51h45.83v29.45H9.03V17.51Z" />
</svg>
</span>Softwares / Interfaces</a>
</li>
<li class="megaMenu__item">
<a href="/en/product/dj-sampler/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M49.13 5.13V1.12h-34v4.01H7v58.31h50.15V5.13h-8.02Zm-31.86 0V3.26h29.72v11.72H17.27V5.13Zm37.88 56.31H9V7.13h6.13v9.99h34V7.13h6.02v54.31Z" />
<path fill="currentColor" d="M10.99 9.13h2v2h-2zM19.13 49.54h2v4h-2zM23.13 49.54h2v4h-2zM27.13 49.54h2v4h-2zM31.13 49.54h2v4h-2zM35.13 49.54h2v4h-2zM39.13 49.54h2v4h-2zM19.13 55.54h2v4h-2zM23.13 55.54h2v4h-2zM27.13 55.54h2v4h-2zM31.13 55.54h2v4h-2zM35.13 55.54h2v4h-2zM39.13 55.54h2v4h-2zM43.13 49.54h2v4h-2zM43.13 55.54h2v4h-2zM50.14 42.6h2v1h-2zM50.14 40.6h2v1h-2zM50.14 38.6h2v1h-2zM49.14 35.6h4v2h-4zM50.14 44.6h2v1h-2zM50.14 46.6h2v1h-2zM50.14 29.6h2v1h-2zM50.14 27.6h2v1h-2zM50.14 25.6h2v1h-2zM50.14 31.6h2v1h-2zM50.14 33.6h2v1h-2z" />
<circle cx="13.15" cy="51.27" r="2" fill="currentColor" />
<circle cx="13.15" cy="57.27" r="2" fill="currentColor" />
<circle cx="13.15" cy="46.27" r="1" fill="currentColor" />
<circle cx="13.15" cy="18.79" r="1" fill="currentColor" />
<circle cx="51.14" cy="22.6" r="1" fill="currentColor" />
<circle cx="52.17" cy="10.13" r="1" fill="currentColor" />
<path fill="currentColor" d="M12.15 29.1h2v12h-2zM12.15 23.01h2v4h-2zM49.14 51.54h4v2h-4zM49.14 55.54h4v2h-4zM19.13 20.07h4.73v4.73h-4.73zM26.22 20.07h4.73v4.73h-4.73zM33.31 20.07h4.73v4.73h-4.73zM40.4 20.07h4.73v4.73H40.4zM19.13 27.16h4.73v4.73h-4.73zM26.22 27.16h4.73v4.73h-4.73zM33.31 27.16h4.73v4.73h-4.73zM40.4 27.16h4.73v4.73H40.4zM19.13 34.25h4.73v4.73h-4.73zM26.22 34.25h4.73v4.73h-4.73zM33.31 34.25h4.73v4.73h-4.73zM40.4 34.25h4.73v4.73H40.4zM19.13 41.34h4.73v4.73h-4.73zM26.22 41.34h4.73v4.73h-4.73zM33.31 41.34h4.73v4.73h-4.73zM40.4 41.34h4.73v4.73H40.4z" />
</svg>
</span>DJ samplers</a>
</li>
<li class="megaMenu__item">
<a href="/en/product/effector/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M60.94 16.18H3.13s-2 6.2-2 15.97 2 16.23 2 16.23h57.81s2-6.46 2-16.23-2-15.97-2-15.97ZM59.33 46.3H4.74c-.3-1.29-.72-3.4-1.05-6.11h29.52l2.89-2.56c1.96 3.97 6.03 6.71 10.76 6.71 6.63 0 12-5.37 12-12s-5.37-12-12-12c-4.71 0-8.77 2.71-10.73 6.66l-2.91-2.62H3.67c.32-2.73.75-4.84 1.06-6.11h54.62c.56 2.3 1.51 7.23 1.51 13.89s-.97 11.78-1.53 14.15ZM4.34 32.34c0-2.21 1.79-4 4-4s4 1.79 4 4-1.79 4-4 4-4-1.79-4-4Zm12 0c0-2.21 1.79-4 4-4s4 1.79 4 4-1.79 4-4 4-4-1.79-4-4Zm21.33-3.95c1.53-3.56 5.07-6.05 9.18-6.05 5.51 0 10 4.49 10 10s-4.49 10-10 10c-4.13 0-7.68-2.52-9.2-6.09l4.4-3.91-4.38-3.95Zm-9.33 3.95c0-2.21 1.79-4 4-4 1.12 0 2.13.46 2.85 1.2.71.72 1.15 1.71 1.15 2.8s-.44 2.08-1.15 2.8c-.73.74-1.74 1.2-2.85 1.2-2.21 0-4-1.79-4-4Z" />
<circle cx="30.18" cy="43.22" r="1" fill="currentColor" />
<circle cx="37.66" cy="43.22" r="1" fill="currentColor" />
<circle cx="37.66" cy="21.32" r="1" fill="currentColor" />
<circle cx="11.87" cy="43.22" r="1" fill="currentColor" />
<circle cx="7.87" cy="43.22" r="1" fill="currentColor" />
<circle cx="7.87" cy="21.32" r="1" fill="currentColor" />
<circle cx="23.53" cy="21.32" r="1" fill="currentColor" />
<path fill="currentColor" d="M14.92 42.22h12v2h-12zM15.2 20.32h1v2h-1zM17.2 20.32h1v2h-1zM19.2 20.32h1v2h-1zM13.2 20.32h1v2h-1zM11.2 20.32h1v2h-1zM46.85 37.14a4.801 4.801 0 0 0 0-9.6 4.801 4.801 0 0 0 0 9.6Z" />
</svg>
</span>DJ effectors</a>
</li>
<li class="megaMenu__item">
<a href="/en/product/production/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M.99 12.91v38.73h62V12.91h-62Zm60 36.73h-58V14.91h58v34.73Z" />
<circle cx="5.98" cy="18.63" r="1" fill="currentColor" />
<path fill="currentColor" d="M4.98 41.63h4v6h-4zM10.98 41.63h4v6h-4zM16.98 41.63h4v6h-4zM22.98 41.63h4v6h-4zM28.98 41.63h4v6h-4zM34.98 41.63h4v6h-4zM40.98 41.63h4v6h-4zM46.98 41.63h4v6h-4zM52.99 45.63h2v2h-2zM56.99 45.63h2v2h-2zM53.06 19.63h-20v14h20v-14Zm-2 12h-16v-10h16v10Z" />
<circle cx="35.06" cy="36.63" r="1" fill="currentColor" />
<circle cx="39.06" cy="36.63" r="1" fill="currentColor" />
<circle cx="43.06" cy="36.63" r="1" fill="currentColor" />
<circle cx="47.06" cy="36.63" r="1" fill="currentColor" />
<circle cx="51.06" cy="36.63" r="1" fill="currentColor" />
<path fill="currentColor" d="M4.98 21.63h2v16h-2zM10.13 17.63h5v5h-5zM17.63 17.63h5v5h-5zM25.13 17.63h5v5h-5zM10.13 25.13h5v5h-5zM17.63 25.13h5v5h-5zM25.13 25.13h5v5h-5zM10.13 32.63h5v5h-5zM17.63 32.63h5v5h-5zM25.13 32.63h5v5h-5z" />
<circle cx="56.97" cy="25.63" r="2" fill="currentColor" />
<path fill="currentColor" d="M54.97 35.63h4v2h-4zM54.97 31.63h4v2h-4zM55.97 17.63h2v2h-2z" />
</svg>
</span>Music production</a>
</li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/product/headphones/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="m50.4 23.21.1 1c.5 4.25 4.08 7.56 8.46 7.56h1v-2h-1c-.27 0-.52-.05-.78-.08l1.35-2.72-3.49-1.76-1.43 2.88c-1.35-1.2-2.21-2.93-2.21-4.88l-.05-1c-.53-10.83-9.47-19.48-20.43-19.48s-19.91 8.66-20.44 19.48l-.05 1c0 1.94-.87 3.67-2.21 4.88l-1.43-2.88-3.49 1.76 1.35 2.72c-.26.03-.51.08-.78.08h-1v2h1c4.38 0 7.96-3.32 8.46-7.56l.1-1c0-10.19 8.29-18.48 18.48-18.48s18.48 8.29 18.48 18.48ZM51.78 32.83l-.82 1.82 7.01 3.16-5 11.09c.47-1.53.81-3.02.94-4.35.25-2.61-.26-4.3-1.45-4.93v-.03l-.11-.05-.66-.3-8.28-3.73L33.4 57.62l6.54 2.94 2.33 1.05.21.09v-.02c.25.09.5.16.77.16 2.63 0 6.19-4.45 8.39-9.32.16-.36.29-.71.44-1.07l1.64.74 6.92-15.36-8.84-3.98ZM41.47 59.04l-5.43-2.44 8.36-18.46 4.18 1.88 1.24.56-8.36 18.46Zm10.45-14.69c-.21 2.12-.98 4.8-2.12 7.33-2.6 5.76-5.65 8.14-6.48 8.12l8.31-18.35c.18.27.47 1.07.29 2.9ZM20.42 35.49l-8.28 3.73-.66.3-.12.05v.03c-1.18.64-1.69 2.32-1.43 4.93.13 1.34.46 2.82.94 4.35l-5-11.09 7.01-3.16-.82-1.82-8.84 3.98 6.92 15.36 1.64-.74c.15.36.28.71.44 1.07 2.2 4.87 5.75 9.32 8.39 9.32.26 0 .51-.07.75-.16v.02l.22-.09 2.33-1.04 6.54-2.95-10.01-22.11Zm-6.39 16.19c-1.14-2.53-1.92-5.2-2.12-7.33-.18-1.83.11-2.63.29-2.9l8.31 18.35c-.82.01-3.88-2.36-6.48-8.12Zm8.33 7.36L14 40.58l1.24-.56 4.18-1.89 8.36 18.46-5.43 2.44Z" />
</svg>
</span>Headphones</a>
</li>
<li class="megaMenu__item">
<a href="/en/product/monitor-speakers/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<circle cx="32.04" cy="57.19" r="1" fill="currentColor" />
<circle cx="32.04" cy="36.61" r="4" fill="currentColor" />
<path fill="currentColor" d="M32.04 27.61a9 9 0 1 0 .001 18.001 9 9 0 0 0-.001-18.001Zm0 16c-3.86 0-7-3.14-7-7s3.14-7 7-7 7 3.14 7 7-3.14 7-7 7Z" />
<path fill="currentColor" d="M46.04 36.61c0-7.73-6.27-14-14-14s-14 6.27-14 14 6.27 14 14 14 14-6.27 14-14Zm-14 12c-6.62 0-12-5.38-12-12s5.38-12 12-12 12 5.38 12 12-5.38 12-12 12Z" />
<path fill="currentColor" d="M11.16 2.93v58.7h41.77V2.93H11.16Zm39.77 18.46c-2.12-7.34-5.64-13.75-7.25-16.47h7.25v16.47ZM37.86 58.67v.95H26.27v-.95c0-1.4-.79-3.15-1.83-4.07-.11-.1-10.95-9.86-10.95-22.4 0-11.75 8.02-25.2 9.3-27.28h18.56c1.28 2.08 9.3 15.52 9.3 27.28 0 12.53-10.84 22.3-10.96 22.4-1.04.93-1.83 2.68-1.83 4.07ZM20.45 4.93c-1.62 2.73-5.17 9.22-7.29 16.61V4.93h7.29Zm-7.29 36.4c3.13 8.63 9.59 14.45 9.95 14.77.61.54 1.16 1.76 1.16 2.58v.95H13.16v-18.3Zm26.7 18.3v-.95c0-.81.55-2.04 1.16-2.58.36-.32 6.76-6.08 9.91-14.64v18.18H39.86Z" />
<circle cx="32.04" cy="13.53" r="2" fill="currentColor" />
<path fill="currentColor" d="M32.04 20.13c5.56 0 9.92-2.9 9.92-6.6s-4.36-6.6-9.92-6.6-9.92 2.9-9.92 6.6 4.36 6.6 9.92 6.6Zm0-11.21c4.29 0 7.92 2.11 7.92 4.6s-3.63 4.6-7.92 4.6-7.92-2.11-7.92-4.6 3.63-4.6 7.92-4.6Z" />
</svg>
</span>Monitor speakers</a>
</li>
<li class="megaMenu__item">
<a href="https://alphatheta.com/product/portable-dj-speaker/wave-eight/black/" class="megaMenu__link" rel="noopener noreferrer" target="_blank"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M52.91 1.91H11.1v58.71h3.23v2.03h6v-2.03h23.35v2.03h6v-2.03h3.23V1.91Zm-2 25.25h-5.96v2h5.96v29.46H13.1V29.16h6.28v-2H13.1V3.91h37.81v23.25Z" />
<path fill="currentColor" d="M45.93 6.91H18.08v17.18h27.85V6.91Zm-2 15.18H20.08V8.91h23.85v13.18Z" />
<path fill="currentColor" d="M32 19.36c4.52 0 8.18-1.8 8.18-3.86s-3.66-3.86-8.18-3.86-8.18 1.97-8.18 3.86 3.66 3.86 8.18 3.86ZM32 37.34c-2.37 0-4.29 1.92-4.29 4.29s1.92 4.29 4.29 4.29 4.29-1.92 4.29-4.29-1.92-4.29-4.29-4.29Z" />
<path fill="currentColor" d="M32 31.98c-5.33 0-9.64 4.32-9.64 9.64s4.32 9.64 9.64 9.64 9.64-4.32 9.64-9.64-4.32-9.64-9.64-9.64Zm0 17.14c-4.14 0-7.5-3.36-7.5-7.5s3.36-7.5 7.5-7.5 7.5 3.36 7.5 7.5-3.36 7.5-7.5 7.5Z" />
<path fill="currentColor" d="M32 26.63c-8.28 0-15 6.72-15 15s6.72 15 15 15 15-6.72 15-15-6.72-15-15-15Zm0 27.86c-7.09 0-12.86-5.77-12.86-12.86S24.91 28.77 32 28.77s12.86 5.77 12.86 12.86S39.09 54.49 32 54.49Z" />
</svg>
</span>Portable DJ Speakers</a>
</li>
<li class="megaMenu__item">
<a href="/en/product/pa-speakers/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M52.91 1.91H11.1v58.71h3.23v2.03h6v-2.03h23.35v2.03h6v-2.03h3.23V1.91Zm-2 25.25h-5.96v2h5.96v29.46H13.1V29.16h6.28v-2H13.1V3.91h37.81v23.25Z" />
<path fill="currentColor" d="M45.93 6.91H18.08v17.18h27.85V6.91Zm-2 15.18H20.08V8.91h23.85v13.18Z" />
<path fill="currentColor" d="M32 19.36c4.52 0 8.18-1.8 8.18-3.86s-3.66-3.86-8.18-3.86-8.18 1.97-8.18 3.86 3.66 3.86 8.18 3.86ZM32 37.34c-2.37 0-4.29 1.92-4.29 4.29s1.92 4.29 4.29 4.29 4.29-1.92 4.29-4.29-1.92-4.29-4.29-4.29Z" />
<path fill="currentColor" d="M32 31.98c-5.33 0-9.64 4.32-9.64 9.64s4.32 9.64 9.64 9.64 9.64-4.32 9.64-9.64-4.32-9.64-9.64-9.64Zm0 17.14c-4.14 0-7.5-3.36-7.5-7.5s3.36-7.5 7.5-7.5 7.5 3.36 7.5 7.5-3.36 7.5-7.5 7.5Z" />
<path fill="currentColor" d="M32 26.63c-8.28 0-15 6.72-15 15s6.72 15 15 15 15-6.72 15-15-6.72-15-15-15Zm0 27.86c-7.09 0-12.86-5.77-12.86-12.86S24.91 28.77 32 28.77s12.86 5.77 12.86 12.86S39.09 54.49 32 54.49Z" />
</svg>
</span>PA speakers</a>
</li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/product/accessories/" class="megaMenu__link"> <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
<path fill="currentColor" d="M21.29 35.25c-.28.77-.48 1.57-.58 2.38l3.96.52c.07-.52.19-1.03.37-1.53l-3.76-1.37ZM36.41 20.24c-.71-.16-1.45-.29-2.21-.38l-.45 3.98c.6.07 1.18.17 1.75.3l.9-3.9ZM40.64 21.77c-.67-.34-1.37-.64-2.07-.9l-1.36 3.76c.56.2 1.1.44 1.62.7l1.82-3.56ZM41.72 27.31l2.66-2.99c-.56-.5-1.16-.97-1.79-1.39l-2.25 3.3c.49.33.95.69 1.38 1.08ZM29.37 32.33l-1.35-3.77c-.77.28-1.5.64-2.2 1.07l2.14 3.38c.45-.28.92-.51 1.41-.69ZM28.44 24.13l-.9-3.9c-.73.17-1.45.38-2.15.63l1.35 3.77c.55-.2 1.12-.37 1.71-.5ZM20.65 40.05c.06.77.2 1.55.4 2.33l3.87-1.02a9.43 9.43 0 0 1-.28-1.63l-3.99.32ZM26.73 33.99l-2.82-2.84c-.58.58-1.09 1.21-1.53 1.9l3.37 2.16c.28-.44.62-.85.99-1.22ZM39.51 47.78l1.84 3.55c.67-.35 1.33-.75 1.95-1.19l-2.31-3.27c-.47.33-.97.64-1.48.9ZM48.97 43.07l-3.7-1.52c-.22.53-.47 1.04-.77 1.53l3.44 2.05c.39-.66.74-1.36 1.03-2.06ZM46.63 47.01l-3.12-2.51c-.36.45-.75.87-1.18 1.27l2.73 2.92c.56-.52 1.08-1.09 1.56-1.68ZM49.85 34.06l-3.93.71c.1.57.17 1.15.19 1.72l4-.17c-.03-.75-.12-1.52-.26-2.27ZM44.85 31.47c.25.53.47 1.07.65 1.62l3.8-1.25c-.24-.73-.52-1.43-.84-2.1l-3.61 1.73ZM42.94 28.56c.38.44.73.91 1.05 1.39l3.34-2.2c-.41-.63-.87-1.24-1.37-1.81l-3.03 2.61ZM50.06 38.6l-3.98-.36c-.05.57-.14 1.13-.28 1.67l3.88.97c.18-.74.31-1.51.38-2.29ZM31.98 23.73l-.04-4c-.76 0-1.47.04-2.19.12l.45 3.98c.57-.06 1.17-.11 1.78-.1ZM20.73 49.5l-2.97 2.68c.49.55 1.01 1.07 1.56 1.57l2.69-2.96c-.45-.41-.87-.84-1.28-1.29ZM18.64 46.6l-3.47 1.98c.37.64.77 1.27 1.2 1.87l3.24-2.34c-.35-.48-.68-.99-.97-1.51ZM23.41 51.94l-2.39 3.21c.59.44 1.2.85 1.83 1.23l2.07-3.42c-.52-.31-1.02-.65-1.51-1.02ZM24.78 57.43c.66.32 1.34.6 2.03.86l1.39-3.75c-.57-.21-1.13-.45-1.68-.71l-1.73 3.61ZM34.75 53.11l-.19-4c-.54.02-1.1 0-1.64-.06l-.55 3.96c.54.08 1.09.12 1.66.12.24 0 .48 0 .72-.02ZM28.9 58.95c.72.19 1.44.34 2.17.46l.62-3.95c-.59-.09-1.18-.21-1.77-.37l-1.02 3.87ZM30.04 52.44l1.32-3.77c-.51-.18-1-.41-1.48-.68l-2.01 3.46c.69.4 1.42.74 2.16 1ZM36.27 48.91l.77 3.93c.75-.15 1.5-.35 2.22-.6l-1.32-3.77c-.54.19-1.1.34-1.66.45ZM19.69 29.84l-3.2-2.39c-.45.59-.86 1.21-1.24 1.86l3.45 2.02c.3-.52.63-1.01.99-1.49ZM17.9 32.9l-3.67-1.59c-.29.68-.56 1.38-.78 2.1l3.82 1.17c.18-.57.38-1.13.62-1.67ZM25.11 25.33l-1.79-3.58c-.67.34-1.32.71-1.94 1.12l2.19 3.35c.5-.32 1.01-.62 1.54-.88ZM22.14 27.27l-2.56-3.07c-.57.48-1.12.99-1.63 1.53l2.89 2.76c.41-.43.85-.84 1.3-1.22ZM16.86 36.3l-3.93-.72c-.13.73-.22 1.47-.27 2.23l3.99.25c.04-.6.11-1.19.21-1.76ZM16.83 41.61c-.1-.58-.16-1.17-.2-1.77l-3.99.22c.04.75.12 1.5.25 2.22l3.94-.67Z" />
<path fill="currentColor" d="M57.45 4.89h-6v1h-4c-.55 0-1 .45-1 1s.45 1 1 1h4v1h2l.07 28.63c0 10.55-8.59 19.14-19.14 19.14v-1c-.3 0-.6 0-.89-.02l-.21 4c.37.02.74.03 1.11.03v-1c11.66 0 21.14-9.48 21.14-21.14V14.54l1.93-9.65Z" />
<path fill="currentColor" d="M32.61 46.59c4.65 0 8.43-3.78 8.43-8.43 0-5.1-4.15-9.26-9.26-9.26v-1c-.41 0-.81.02-1.21.06l.43 3.98c.26-.03.52-.04.79-.04v-1c4 0 7.26 3.26 7.26 7.26 0 3.54-2.88 6.43-6.43 6.43H18.65c-4.88 0-8.84-3.96-8.84-8.84V16.66l1.04-2.83V8.58H9.83V4.99h-2v3.59H6.81v5.25l1 2.83v19.09c0 5.98 4.86 10.84 10.84 10.84h13.97Z" />
</svg>
</span>Accessories</a>
</li>
</ul>
</div>
<div class="megaMenu__aside">
<div class="megaMenu__aside__inner">
<a href="http://rekordbox.com" class="megaMenu__banner" target="_blank">
<span class="megaMenu__banner__visual responsiveImage--bg">
<em data-mq="small" href="https://preprod.pioneerdj.com/-/media/pioneerdj/images/navigation/dropdown-menu/rb6-mega-menu-banner-mobile-250x90.jpg?mh=90&w=250&hash=019BEEC30C5CECD8104BCFCDC9531771"></em>
<em data-mq="large" href="https://preprod.pioneerdj.com/-/media/pioneerdj/images/navigation/dropdown-menu/rb6-mega-menu-banner-320x200.jpg?h=200&w=320&hash=B21B6185B82A99FFEFD9F7634FF2D874"></em>
</span>
<div class="megaMenu__banner__content">
<p class="megaMenu__banner__title"></p>
<div class="megaMenu__banner__desc"></div>
</div>
<div class="megaMenu__banner__icon">
<span class="button button--subtle">
<i class="button__icon">
<svg class="symbol symbol--arro-right" viewBox="0 0 27 18" version="1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g transform="translate(-38 -1)" fill="none" fill-rule="evenodd">
<path class="theFill" d="M38.009 1.001h26.988L47.14 19.005v-6.65H38.01z" />
<path class="theStroke" stroke="#395EE2" stroke-width="2" d="M39.009 2.001v9.355h9.131v5.22L62.597 2.002H39.009z" />
</g>
</svg>
</i>
</span>
</div>
</a>
</div>
</div>
<div class="megaMenu__cta">
<ul class="megaMenu_btnlist">
<li class="megaMenu_btn">
<a href="/en/product/" class="button"> <span class=" button__label">All categories</span>
</a>
</li>
<li class="megaMenu_btn"><a href="/en/product/archive/" class="button"><span class="button__label">Archived products</span></a></li>
</ul>
</div>
</div>
</div>
</section>
</li>
<li class="mainNav__item">
<a href="/en/news/" class="mainNav__link">News</a>
</li>
<li class="mainNav__item">
<a href="http://blog.pioneerdj.com" class="mainNav__link" rel="noopener noreferrer" target="_blank">Blog</a>
</li>
<li class="mainNav__item">
<section class="megaMenu">
<a class="mainNav__link megaMenu__trigger">Support</a>
<span class="megaMenu__icon megaMenu__trigger"></span>
<div class="megaMenu__target">
<div class="megaMenu__inner">
<div class="megaMenu__links">
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/articles/11949537649305" class="megaMenu__link" rel="noopener noreferrer" target="_blank"> <span class="megaMenu__link__icon">
</span>Downloads (Firmware, driver etc.)</a>
</li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/articles/11949532807193" class="megaMenu__link" rel="noopener noreferrer" target="_blank"> <span class="megaMenu__link__icon">
</span>Manuals & documentation</a>
</li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/articles/11949656174617" class="megaMenu__link" rel="noopener noreferrer" target="_blank"> <span class="megaMenu__link__icon">
</span>DJ Application & OS Support information</a>
</li>
<li class="megaMenu__item">
<a href="/en/landing/technical-riders/" class="megaMenu__link"> <span class="megaMenu__link__icon">
</span>Technical Riders</a>
</li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/support/support-archive/" class="megaMenu__link"> <span class="megaMenu__link__icon">
</span>Archived products</a>
</li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us" class="megaMenu__link" rel="noopener noreferrer" target="_blank"> <span class="megaMenu__link__icon">
</span>FAQ (Visit Help Center)</a>
</li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/categories/4416914873369" class="megaMenu__link" rel="noopener noreferrer" target="_blank"> <span class="megaMenu__link__icon">
</span>Service centers</a>
</li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/categories/4417227498393" class="megaMenu__link" rel="noopener noreferrer" target="_blank"> <span class="megaMenu__link__icon">
</span>Contact</a>
</li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/categories/4416175431577" class="megaMenu__link" rel="noopener noreferrer" target="_blank"> <span class="megaMenu__link__icon">
</span>AlphaTheta Account FAQ</a>
</li>
</ul>
</div>
<div class="megaMenu__cta">
<ul class="megaMenu_btnlist">
<li class="megaMenu_btn">
<a href="https://support.pioneerdj.com/hc/en-us" class="button" rel="noopener noreferrer" target="_blank"> <span class=" button__label">All support</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</section>
</li>
<li class="mainNav__item">
<a href="https://alphatheta.com/en/store-locator/" class="mainNav__link" rel="noopener noreferrer" target="_blank">Find a store</a>
</li>
</ul>
</nav>
</div>
<div class="header__actionNav">
<nav class="actionNav">
<div class="actionNav__item">
<div class="search">
<a class="search__trigger search__trigger--open header__trigger--close">
<svg class="symbol symbol--search" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 57">
<path fill="currentColor" d="M60 54.93 39.86 34.91a21.74 21.74 0 0 0 4.28-12.97C44.14 9.84 34.24 0 22.07 0S0 9.84 0 21.94s9.9 21.94 22.07 21.94c6.23 0 11.87-2.59 15.88-6.73L57.92 57 60 54.93ZM22.07 40.95c-10.55 0-19.13-8.53-19.13-19.02S11.52 2.92 22.07 2.92 41.2 11.45 41.2 21.94s-8.58 19.02-19.13 19.02Z" />
</svg>
</a>
<div class="search__inner">
<form action="/search-results" class="search__form">
<div class="search__field">
<input name="q" type="search" class="search__input input__search" data-search-page="/search-results?q=" data-no-results="Oops nothing can be found" data-nothing-entered="Please enter a search query">
<a href="#0" class="search__closeTrigger search__trigger--close">
<svg class="symbol symbol--close" viewBox="0 0 12 14" version="1" xmlns="http://www.w3.org/2000/svg">
<path d="M6.066 5.492L2.372.931A1 1 0 1 0 .818 2.19l3.848 4.752L.418 11.34a1 1 0 0 0 1.439 1.39v-.001l4.077-4.222 3.694 4.561a1 1 0 1 0 1.554-1.259L7.334 7.059l4.248-4.399a1 1 0 0 0-1.439-1.39v.001L6.066 5.492z" fill="currentColor" fill-rule="evenodd" />
</svg>
<span class="screenReader">Close</span>
</a>
</div>
<span class="search__loader"></span>
</form>
<div class="search__overlay search__trigger--close"></div>
<div class="search__results">
<div class="search__results__inner">
<h3 class="heading heading--2 heading--fancy">
Top results
</h3>
<ul class="search__list"><!-- POPULATED WITH JAVASCRIPT --></ul>
<a class="search__cta button trigger__searchpage"><span class="button__label">See all results</span></a>
<p class="search__note">
Didn’t find what you’re looking for? Maybe use fewer words or a more general search term.<br />If you still have no luck you can contact our <a href="/en/support/contact">customer service</a>.
</p>
</div>
</div>
</div>
</div>
</div>
</nav>
</div>
<div class="header__profileNav">
<nav class="profileNav">
<script>
dataLayer.push({
'event': 'login_status',
'logged_in': 'false'
});
</script>
<div class="profileNav__item">
<a href="/en/account/register/" class="profileNav__link">
<span class="profileNav__label">Register</span>
</a>
</div>
<div id="LoginRegister" class="profileNav__item">
<a href="/en/account/login/?relPath=en%2Fproduct%2Fcontroller%2Fddj-flx10%2Fblack%2Foverview%2F" class="profileNav__link">
<span class="profileNav__label">Log in</span>
</a>
</div>
<div class="profileNav__item profileNav__item--lang">
<a href="/selectCountry/" class="profileNav__link flag flag-INT" style="margin:0;width:20px"></a>
</div>
</nav>
<!--<script type="text/javascript">
synchroniseLoginStatus();
$("#loginlink").click(function () {
if (window.location.href.indexOf("account/about") > -1) {
document.getElementById("loginlink").setAttribute("target", "_blank")
}
});
</script>-->
<script type="text/javascript">
if (typeof synchroniseLoginStatus === typeof
function() {}) {
synchroniseLoginStatus();
}
const loginlink = document.querySelector('#loginlink');
if (loginlink) {
loginlink.addEventListener('click', e => {
if (window.location.href.indexOf("account/about") > -1) {
loginlink.setAttribute("target", "_blank")
}
});
}
</script>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<script>
if (window.location.href.indexOf("/product-register/") > -1) {
var urlQuery = window.location.href.split('?')[1];
var redURl = '/account/hardware/product-registration/?' + urlQuery;
console.log(redURl);
window.location.href = redURl;
}
</script>
<div id="the-bucket">
<style type="text/css">
@media screen and (max-width: 768px) {
.visual img {
object-fit: contain;
}
.media__slide {
padding-top: 73.86667% !important;
}
.hero-product__content {
padding-bottom: var(--gap--10) !important;
}
}
</style>
<input type="hidden" id="ProductID" value="{A3F92FDD-27B2-4AF5-9F87-269D6E706D20}" />
<input type="hidden" id="ProductCategoryName" value="DDJ-FLX10" />
<div class="spacer spacer--6"></div>
<section class="hero-product">
<div class="hero-product__in">
<div class="hero-product__inner">
<div class="hero-product__media">
<section class="media media--slider">
<div class="media__slider swiper-container swiper-container-initialized swiper-container-horizontal">
<div class="swiper-wrapper" style="transform: translate3d(0px, 0px, 0px);">
<div class="swiper-slide">
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png">
<a href="#" data-zoomer="gallery" data-zoomer-gallery="product-here" data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png" data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png" alt="pc-cgi_angle" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png' });">
</a>
</picture>
</div>
</div>
<div class="swiper-slide">
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png">
<a href="#" data-zoomer="gallery" data-zoomer-gallery="product-here" data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png" data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png" alt="pc-cgi_frontangle" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png' });">
</a>
</picture>
</div>
</div>
<div class="swiper-slide">
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png">
<a href="#" data-zoomer="gallery" data-zoomer-gallery="product-here" data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png" data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png" alt="pc-cgi_top" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png' });">
</a>
</picture>
</div>
</div>
<div class="swiper-slide">
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png">
<a href="#" data-zoomer="gallery" data-zoomer-gallery="product-here" data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png" data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png" alt="pc-cgi_front" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png' });">
</a>
</picture>
</div>
</div>
<div class="swiper-slide">
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png">
<a href="#" data-zoomer="gallery" data-zoomer-gallery="zoomer-id-ddjflx10" data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png" data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png" alt="pc-cgi_rear" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png' });">
</a>
</picture>
</div>
</div>
</div>
<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
</div>
<div class="media__thumbs swiper-container swiper-container-initialized swiper-container-horizontal swiper-container-free-mode thumbs-init swiper-container-thumbs">
<div class="swiper-wrapper" style="transform: translate3d(0px, 0px, 0px);">
<div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png?h=273&w=372&hash=D4FBA6798E5B0043D1CD544C00A9141E">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png?h=273&w=372&hash=D4FBA6798E5B0043D1CD544C00A9141E" alt="pc-cgi_angle" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png' });">
</picture>
</div>
</div>
<div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png?h=273&w=372&hash=20FF9D1D001D50F3BC2F1E19CB4FC0F9">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png?h=273&w=372&hash=20FF9D1D001D50F3BC2F1E19CB4FC0F9" alt="pc-cgi_frontangle" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png' });">
</picture>
</div>
</div>
<div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png?h=273&w=372&hash=09696ABE784490CFDBF86649C17419AF">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png?h=273&w=372&hash=09696ABE784490CFDBF86649C17419AF" alt="pc-cgi_top" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png' });">
</picture>
</div>
</div>
<div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png?h=273&w=372&hash=34C55502C148A0B633F7ADD09D877A65">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png?h=273&w=372&hash=34C55502C148A0B633F7ADD09D877A65" alt="pc-cgi_front" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png' });">
</picture>
</div>
</div>
<div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png?h=273&w=372&hash=60DCE44A03D5DF2D37AEAEDE420A5DC6">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png?h=273&w=372&hash=60DCE44A03D5DF2D37AEAEDE420A5DC6" alt="pc-cgi_rear" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png' });">
</picture>
</div>
</div>
</div>
<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
</div>
</section>
</div>
<div class="hero-product__content">
<div class="hero-product__back caption">
<a href="/en/product/controller/" class="link link--underlined" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Back to parent page', 'dlLabel': 'DJ Controller', 'dlPosition': 'top', 'dlURL': '/en/product/controller/' });">
<span class="link__label">< DJ Controller</span>
</a>
</div>
<input type="hidden" id="productCurrentItem" value="{1A92247D-72E5-4073-A3BF-6219CC326799}" />
<div class="hero-product__logos">
</div>
<div class="hero-product__intro">
<h3 class="hero-product__heading heading" id="product_name">DDJ-FLX10</h3>
<div class="hero-product__description">
4-channel performance DJ controller for multiple DJ applications (Black)
</div>
</div>
<div class="hero-product__info">
<h3 class="hero-product__subheading heading"><img src="/-/media/pioneerdj/images/features/Controller/DDJ-FLX10/DDJ-FLX10_Strapline_550x45.png" alt="SPLIT.MIX.CREATE" style="width: 100%;"></h3>
<div class="hero-product__description p--2">
The DDJ-FLX10 is a 4-channel performance DJ controller for rekordbox and Serato DJ Pro. It includes a host of brand-new features including Track Separation technology, which enables new creative possibilities such as the easy performance of mash-ups on the fly with no need to prepare tracks in advance.
</div>
</div>
<div class="hero-product__colors">
<div class="hero-product__color">
<a href="/en/product/controller/ddj-flx10/black/overview/" class="radio-color" style="background: #000000;" title="Black" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Filter', 'dlElement': 'Color', 'dlLabel': 'Black', 'dlPosition': 'Middle', 'dlURL': '/en/product/controller/ddj-flx10/black/overview/' });"></a>
</div>
</div>
<div class="hero-product__price">
</div>
<section class="overlay-modal" data-modal="warranty-info">
<div class="overlay-modal__overlay">
<span class="overlay-modal__bg overlay-modal__trigger--close"></span>
<div class="overlay-modal__inner">
<span class="overlay-modal__close overlay-modal__trigger--close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span>
</span>
<div class="overlay-modal__content">
<h3 class="heading heading--4">
<span data-step="1">AlphaTheta Care NAME</span>
</h3>
<div class="overlay-modal__description">
<div class="form-container__info">
<h3 class="form-container__info--title">AlphaTheta Care Plus</h3>
<p class="form-container__info--text">NAME</p>
<br>
<h3 class="form-container__info--title">AlphaTheta Care Pro</h3>
<p class="form-container__info--text">NAME</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="overlay-modal" data-modal="atc-care">
<div class="overlay-modal__overlay">
<span class="overlay-modal__bg overlay-modal__trigger--close"></span>
<div class="overlay-modal__inner">
<span class="overlay-modal__close overlay-modal__trigger--close" onclick="clearText()">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span>
</span>
<div class="overlay-modal__content">
<h3 class="heading heading--4">
<span class="form-title" id="formTitle"></span>
</h3>
<br>
<form id="form-atccare" class="form-container" novalidate>
<div class="client">
<div class="client__type">
<div class="customer-field">
<input class="custom-radio" name="care" id="private" type="radio" value="private" checked onclick="validateAddtoCartbtn()">
<label id="private_client" for="private">
</label>
</div>
</div>
<div class="client__type">
<div class="customer-field">
<input class="custom-radio" name="care" id="business" type="radio" value="business" onclick="validateAddtoCartbtn()">
<label id="business_client" for="business">
</label>
</div>
</div>
</div>
<div class="overlay-modal__form">
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="firstname" id="name" value="" errorId="name_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">NAME</span>
</div>
<span id="name_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">Enter valid name</span>
</div>
<br>
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="surname" id="surname" value="" errorId="surname_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">NAME</span>
</div>
<span id="surname_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">
* Please enter the "Last Name".</span>
</div>
<br>
<div class="business-field hidden">
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="corporate" id="corporate_name" value="" disabled errorId="corporate_name_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">Corporate Name</span>
</div>
<span id="corporate_name_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">
* Please enter the "Last Name".</span>
</div>
<br>
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="club" id="club_name" value="" disabled errorId="club_name_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">ClubName</span>
</div>
<span id="club_name_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">
* Please enter the "Last Name".</span>
</div>
<br>
</div>
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="email" id="email" value="" errorId="email_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">NAME</span>
</div>
<span id="email_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">email address error message</span>
<span id="email-format_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">email address format error message</span>
</div>
<br>
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="confirm-email" value="" id="confirm-email" errorId="confirm-email_error_txt" onfocusout="formValidation(this)" onpaste="return false;" ondrop="return false;" autocomplete="off">
<span class="input-field__placeholder">NAME</span>
</div>
<span id="confirm-email_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">Enter your confirmation email address - error message</span>
<span id="confirm-email-match_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">Email Address Match - error message</span>
</div>
<br>
<div class="overlay-modal__note">
<div class="checkbox">
<label class="checkbox__inner">
<input class="input-field__info" type="checkbox" name="agree" value="agree" id="agree" onclick="validateAddtoCartbtn()">
<span class="checkbox__spoof">
<span class="checkbox__icon">
<svg class="icon-check" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 12">
<path fill="currentColor" d="M5.961 12L0 6.039l2.4-2.4L5.961 7.2 13.084 0l2.4 2.477L5.96 12z" />
</svg>
</span>
</span>
</label>
</div>
</div>
<div class="overlay-modal__action">
<a href="javascript:void(0)" class="action action--normal action--on-light btn-buy-now" id="btn_buynow" goal-id="{3EF4DC1F-C8B7-414A-A50B-2C3B3C993CF7}" data-sku="" data-variantsku="" data-pwwsku data-pwwvariantsku data-careprodname="DDJ-FLX10" data-planselected data-planprice data-modelnumber="DDJ-FLX10" data-culturecode="en" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Buy online', 'dlLabel': '', 'dlPosition': 'top', 'dlURL': 'javascript:void(0)'});buynow()">
<span class="action__bg"></span>
<span class="action__label">Buy Now</span>
</a>
<span style="font-size: 0.75rem;" id="annotationMsgOnAddToCart"> </span>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<div class="hero-product__actions actions actions--stack actions--force">
<div class="actions__item">
<a id="wheretobuy" href="/en/shops/search/#/{D7A7E2DF-B000-42C8-9533-543B93B3A203}/{E25E5942-A974-4675-ACEB-8C204EC8A445}" goal-id="{B4414F34-A71F-495A-83F6-CE4A7D041164}" class="action action--normal action--on-light" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Where to Buy', 'dlLabel': '', 'dlPosition': 'top', 'dlURL': '/en/shops/search/'});">
<span class="action__bg"></span>
<span class="action__label">Where to buy</span>
</a>
</div>
</div>
</div>
</div>
</div>
</section>
<script>
//Added - Dealer Locator - Passing ProductItem ID and its corresponding Product CategoryID to the query string
// var findastorevalue = jQuery('li.mainNav__item').children().last().attr('href');
// jQuery('li.mainNav__item').children().last().attr('href', findastorevalue + '#/' + $("#ProductCategoryID").val() + '/' + $("#ProductID").val());
var validMailId = false;
var validCaptcha = false;
function validateEmail($email) {
var emailReg = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
return emailReg.test($email);
}
function ClearErrors() {
$("#MailError").hide();
$("#CaptchaError").hide();
$("#MailExists").hide();
}
function registerbackorder(event) {
event.preventDefault();
ClearErrors();
var emailIDValue = $('[name=emailaddress]').val();
if (!validateEmail(emailIDValue)) {
$("#MailError").show();
validMailId = false;
} else {
validMailId = true
}
var ContextIDValue = $("#productCurrentItem").val();
var captcharesponse = grecaptcha.getResponse();
if (validMailId && (captcharesponse == null || captcharesponse == "")) {
$("#CaptchaError").show();
validCaptcha = false;
} else {
validCaptcha = true
}
if (validCaptcha && validMailId) {
jQuery.ajax({
type: "POST",
url: '/api/sitecore/BackOrder/Add',
data: JSON.stringify({
emailid: emailIDValue,
contextItemId: ContextIDValue,
CaptchaResponse: captcharesponse
}),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
if (data.Success) {
//document.querySelector('.overlay-modal').setAttribute('data-step', 2); return false;
document.querySelectorAll(".overlay-modal").forEach(ele => {
if (ele.getAttribute("data-notificationmodal") == "notification-info")
ele.setAttribute('data-step', 2);
});
return false;
} else {
if (data.FailureCode = "100") {
$("#MailExists").show();
}
}
},
//failure: function (response) {
// alert(response.responseText);
//},
error: function(response) {
alert(response.statusText);
}
});
}
}
function warrantySelection(data) {
var pwwsku = data.getAttribute('data-pwwsku');
var pwwvariantsku = data.getAttribute('data-pwwvariantsku');
var planSelected = data.getAttribute('data-planselected');
var planPrice = data.getAttribute('data-planprice');
var btn_buynow = document.querySelector('#btn_buynow');
if (btn_buynow != null) {
btn_buynow.setAttribute('data-pwwsku', pwwsku);
btn_buynow.setAttribute('data-pwwvariantsku', pwwvariantsku);
btn_buynow.setAttribute('data-planselected', planSelected);
btn_buynow.setAttribute('data-planprice', planPrice);
}
if (document.getElementById('care-plus') != null && document.getElementById('care-plus').checked) {
document.getElementById('formTitle').innerHTML = document.getElementById('care-plus').value;
} else if (document.getElementById('care-pro') != null && document.getElementById('care-pro').checked) {
document.getElementById('formTitle').innerHTML = document.getElementById('care-pro').value;
}
ShowHideBuyNowBtn();
}
ShowHideBuyNowBtn();
function ShowHideBuyNowBtn() {
if (document.getElementById('btn_addtocart') != null)
document.getElementById('btn_addtocart').style.display = "none";
if (document.getElementById('btn_addtocartpww') != null)
document.getElementById('btn_addtocartpww').style.display = "none";
var element = document.getElementById('care-no');
if (typeof element !== "undefined" && element !== null) {
if (document.getElementById('care-no').checked && document.getElementById('btn_addtocartpww') != null) {
document.getElementById('btn_addtocartpww').style.display = "block";
} else if (((document.getElementById('care-plus') != null && document.getElementById('care-plus').checked) ||
(document.getElementById('care-pro') != null && document.getElementById('care-pro').checked)) &&
document.getElementById('btn_addtocart') != null) {
document.getElementById('btn_addtocart').style.display = "block";
}
} else if (document.getElementById('btn_addtocartpww') != null) {
document.getElementById('btn_addtocartpww').style.display = "block";
}
}
function buynow() {
//get form details
var surname = jQuery('#surname').val();
var name = jQuery('#name').val();
var email = jQuery('#email').val();
var element = document.getElementById('ProductCategoryName');
if (typeof element !== "undefined" && element !== null) {
var productname = jQuery('#ProductCategoryName').val();
} else {
var productname = document.getElementById('product_name').innerHTML;
}
if (document.getElementById('care-plus') != null && document.getElementById('care-plus').checked) {
var warrantytype = document.getElementById('care-plus').value;
} else if (document.getElementById('care-pro') != null && document.getElementById('care-pro').checked) {
var warrantytype = document.getElementById('care-pro').value;
}
if (document.getElementById('private').checked) {
var userformtype = document.getElementById('private_client').innerHTML;
} else if (document.getElementById('business').checked) {
var userformtype = document.getElementById('business_client').innerHTML;
}
var corporatename = jQuery('#corporate_name').val();
var clubname = jQuery('#club_name').val();
if (window.FormData == undefined)
alert("Error: FormData is undefined");
var fileData = new FormData();
//save formdetails to object
const object = {
Surname: surname,
Name: name,
Email: email,
CorporateName: corporatename,
ClubName: clubname,
WarrantyType: warrantytype,
UserFormType: userformtype,
ProductName: productname,
};
//append object details to filedata
for (var key in object) {
fileData.append(key, object[key]);
}
jQuery.ajax({
url: '/api/sitecore/Product/SaveUserFormDetails',
type: 'post',
datatype: 'json',
contentType: false,
processData: false,
async: false,
data: fileData,
success: function(response) {
console.log("Form Success");
}
});
}
function clearText() {
$('input[type=text]').each(function() {
$(this).val('');
});
document.querySelectorAll('div.input-field').forEach(function(ele) {
ele.classList.remove('has-value');
});
hideFormErrorMessage();
}
//Page reload for radio reset
window.addEventListener("pageshow", function(event) {
var historyTraversal = event.persisted || (typeof window.performance != "undefined" && window.performance.navigation.type === 2);
if (historyTraversal) {
window.location.reload();
}
});
//form validation
hideFormErrorMessage();
function hideFormErrorMessage() {
document.getElementById("name_error_txt").style.display = "none";
document.getElementById("surname_error_txt").style.display = "none";
document.getElementById("corporate_name_error_txt").style.display = "none";
document.getElementById("club_name_error_txt").style.display = "none";
document.getElementById("email_error_txt").style.display = "none";
document.getElementById("email-format_error_txt").style.display = "none";
document.getElementById("confirm-email_error_txt").style.display = "none";
document.getElementById("confirm-email-match_error_txt").style.display = "none";
var cultureCode = 'en';
if (cultureCode == "en-us") {
document.getElementById("streetaddress_error_txt").style.display = "none";
document.getElementById("city_error_txt").style.display = "none";
document.getElementById("zipcode_error_txt").style.display = "none";
document.getElementById("state_error_txt").style.display = "none";
document.getElementById("phone_error_txt").style.display = "none";
document.getElementById("phone-format_error_txt").style.display = "none";
}
document.getElementById("agree").checked = false;
document.querySelector("#btn_buynow").setAttribute("disabled", true)
document.getElementById("annotationMsgOnAddToCart").style.display = "none";
}
function formValidation(data) {
var elementId = data.attributes['id'].value;
var elementErrorId = data.attributes['errorId'].value;
switch (elementId) {
case "name":
case "surname":
case "corporate_name":
case "club_name":
case "streetaddress":
case "city":
case "zipcode":
case "state":
document.getElementById(elementErrorId).style.display = "none";
if (document.getElementById(elementId).value == "")
document.getElementById(elementErrorId).style.display = "block";
break;
case "phone":
document.getElementById(elementErrorId).style.display = "none";
document.getElementById("phone-format_error_txt").style.display = "none";
var regex = new RegExp(/\+?\d{0,3}[\s\(\-]?([0-9]{2,3})[\s\)\-]?([\s\-]?)([0-9]{3})[\s\-]?([0-9]{2})[\s\-]?([0-9]{2})/g);
var phoneValue = document.getElementById(elementId).value;
if (phoneValue == "")
document.getElementById(elementErrorId).style.display = "block";
else if (!regex.test(phoneValue))
document.getElementById("phone-format_error_txt").style.display = "block";
break;
case "email":
document.getElementById(elementErrorId).style.display = "none";
document.getElementById("email-format_error_txt").style.display = "none";
document.getElementById("confirm-email-match_error_txt").style.display = "none";
if (document.getElementById(elementId).value == "") {
document.getElementById(elementErrorId).style.display = "block";
} else if (!validateEmail(document.getElementById(elementId).value)) {
document.getElementById("email-format_error_txt").style.display = "block";
} else if (!validateEmailId(document.getElementById(elementId).value, document.getElementById("confirm-email").value)) {
document.getElementById("confirm-email-match_error_txt").style.display = "block";
}
break;
case "confirm-email":
document.getElementById(elementErrorId).style.display = "none";
document.getElementById("confirm-email-match_error_txt").style.display = "none";
if (document.getElementById(elementId).value == "") {
document.getElementById(elementErrorId).style.display = "block";
} else if (!validateConfirmEmailId(document.getElementById(elementId).value, document.getElementById("email").value)) {
document.getElementById("confirm-email-match_error_txt").style.display = "block";
}
break;
}
validateAddtoCartbtn();
}
function validateEmailId(email1, email2) {
if (email1 != "" && email2 == "") {
return true;
} else {
return validateConfirmEmailId(email1, email2)
}
return false;
}
function validateConfirmEmailId(email1, email2) {
if (email1 != "" && email2 != "") {
if (email1 == email2)
return true;
}
return false;
}
function validateAddtoCartbtn() {
document.querySelector("#btn_buynow").setAttribute("disabled", true)
document.getElementById("annotationMsgOnAddToCart").style.display = "none";
if ((document.getElementById("name").value != "" && document.getElementById("name_error_txt").style.display == "none") &&
(document.getElementById("surname").value != "" && document.getElementById("surname_error_txt").style.display == "none") &&
(document.getElementById("email").value != "" &&
document.getElementById("email_error_txt").style.display == "none" &&
document.getElementById("email-format_error_txt").style.display == "none") &&
(document.getElementById("confirm-email").value != "" &&
document.getElementById("confirm-email_error_txt").style.display == "none" &&
document.getElementById("confirm-email-match_error_txt").style.display == "none") &&
document.getElementById("agree").checked == true) {
var cultureCode = 'en';
if (cultureCode == "en-us") {
if ((document.getElementById("streetaddress").value != "" && document.getElementById("streetaddress_error_txt").style.display == "none") &&
(document.getElementById("city").value != "" && document.getElementById("city_error_txt").style.display == "none") &&
(document.getElementById("zipcode").value != "" && document.getElementById("zipcode_error_txt").style.display == "none") &&
(document.getElementById("state").value != "" && document.getElementById("state_error_txt").style.display == "none") &&
(document.getElementById("phone").value != "" &&
document.getElementById("phone_error_txt").style.display == "none" &&
document.getElementById("phone-format_error_txt").style.display == "none")) {
setRequiredAttributes();
}
} else {
setRequiredAttributes();
}
}
}
function setRequiredAttributes() {
if (document.getElementById("business").checked == true) {
if ((document.getElementById("corporate_name").value != "" && document.getElementById("corporate_name_error_txt").style.display == "none") &&
(document.getElementById("club_name").value != "" && document.getElementById("club_name_error_txt").style.display == "none")) {
document.querySelector("#btn_buynow").setAttribute("disabled", false)
document.getElementById("annotationMsgOnAddToCart").style.display = "block";
}
} else {
document.querySelector("#btn_buynow").setAttribute("disabled", false)
document.getElementById("annotationMsgOnAddToCart").style.display = "block";
}
}
disableEmail();
function disableEmail() {
var cultureCode = 'en';
if (cultureCode == "en-us") {
var email = '';
var emailElement = document.getElementById("email");
var confirmEmailElement = document.getElementById("confirm-email");
if (email != "") {
emailElement.value = email;
emailElement.disabled = true;
confirmEmailElement.value = email;
confirmEmailElement.disabled = true;
} else {
emailElement.value = "";
emailElement.disabled = false;
confirmEmailElement.value = "";
confirmEmailElement.disabled = false;
}
}
}
</script>
<div class="nav-in-page-v2 nav-in-page-v2--top-spacing">
<div class="nav-in-page-v2 nav-in-page-v2--medium">
<span class="nav-in-page-v2__anchor"></span>
<div class="nav-in-page-v2__inner">
<a class="nav-in-page-v2__label">
<span class="link__label">Overview</span>
<div class="link__icon">
<svg class="icon-chevron" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<path fill="currentColor" d="M11.172 9.82L13 8 9.906 4.99 6.04 1.21c-.281-.28-.703-.28-.914 0l-.914.91c-.281.28-.281.7 0 .91L9.273 8l-5.062 4.97c-.281.28-.281.7 0 .91l.914.91c.281.28.703.28.914 0l5.133-4.97z"></path>
</svg>
</div>
</a>
<nav class="nav-in-page-v2__nav">
<ul class="nav-in-page-v2__nav-items">
<li class="nav-in-page-v2__nav-item active">
<a href="/en/product/controller/ddj-flx10/black/overview/#the-bucket" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Overview', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/overview/#the-bucket' });">
<span class="link__label">Overview</span>
</a>
</li>
<li class="nav-in-page-v2__nav-item">
<a href="/en/product/controller/ddj-flx10/black/specifications/" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Specifications', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/specifications/' });">
<span class="link__label">Specifications</span>
</a>
</li>
<li class="nav-in-page-v2__nav-item">
<a href="/en/product/controller/ddj-flx10/black/support/" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Support', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/support/' });">
<span class="link__label">Support</span>
</a>
</li>
</ul>
</nav>
<div class="nav-in-page-v2__actions">
<div class="nav-in-page-v2__actions-inner">
<a id="wheretobuy" href="/en/shops/search/" goal-id="{B4414F34-A71F-495A-83F6-CE4A7D041164}" class="link link--colored" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Floating where to buy', 'dlLabel': 'Black', 'dlPosition': '', 'dlURL': '/en/shops/search/' });">
<span class="link__label">Where to buy</span>
</a>
<a id="wheretobuy" href="/en/shops/search/" goal-id="{B4414F34-A71F-495A-83F6-CE4A7D041164}" class="action action--normal action--on-light" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Floating where to buy', 'dlLabel': 'Black', 'dlPosition': '', 'dlURL': '/en/shops/search/' });">
<span class="action__bg"></span>
<span class="action__label">Where to buy</span>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="nav-in-page-v2 nav-in-page-v2--small hidden">
<span class="nav-in-page-v2__anchor"></span>
<div class="nav-in-page-v2__inner">
<nav class="nav-in-page-v2__inner__nav">
<ul class="nav-in-page-v2__inner__nav-items">
<li class="nav-in-page-v2__nav-item active">
<a href="/en/product/controller/ddj-flx10/black/overview/#the-bucket" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Overview', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/overview/#the-bucket' });">
<span class="link__label">Overview</span>
</a>
</li>
<li class="nav-in-page-v2__nav-item">
<a href="/en/product/controller/ddj-flx10/black/specifications/" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Specifications', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/specifications/' });">
<span class="link__label">Specifications</span>
</a>
</li>
<li class="nav-in-page-v2__nav-item">
<a href="/en/product/controller/ddj-flx10/black/support/" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Support', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/support/' });">
<span class="link__label">Support</span>
</a>
</li>
</ul>
</nav>
</div>
</div>
<style type="text/css">
@media screen and (max-width: 768px) {
.nav-in-page-v2--is-scroll .nav-in-page-v2__nav .nav-in-page-v2__link {
color: var(--color--neutrals-10);
}
.nav-top-page__link {
color: var(--color--neutrals-10);
}
}
</style>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() {
const navInPageV2 = document.querySelector('.nav-in-page-v2');
const navTopPage = document.querySelector('.nav-top-page');
const heroProduct = document.querySelector('.hero-product');
if (navInPageV2 && navTopPage) {
if (heroProduct) {
navTopPage.parentNode.removeChild(navTopPage);
} else {
navInPageV2.parentNode.removeChild(navInPageV2);
navTopPage.classList.remove('hidden');
}
}
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content section--9 col-xs-12">
<div class="component-content" id='Video player'>
<section class="media media--contained">
<div class="media__inner">
<div class="video-player">
<picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj_flx_10_video_thumbnail_1920x1080.jpg">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj_flx_10_video_thumbnail_1920x1080.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj_flx_10_video_thumbnail_1920x1080.jpg" alt="">
</picture>
<a class="video-player__trigger">
<span class="video-ID">N0dg3GNnoRw</span>
<span class="video-url"></span>
<span class="icon-play">
<span class="icon-play__inner"></span>
<span class="icon-play__icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z" />
</svg>
</span>
</span> </a>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12" id="seeallvideos">
<div class="component-content" id='default-text'>
<section class="col-one">
<div class="col-one__inner">
<div class="col-one__content field-text">KEY FEATURES</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12">
<div class="component-content" id='Content1'>
<section>
<div class="col-two__inner">
<div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content1'>
<div class="col-two__visual">
<div class="video-player">
<div class="video-bg">
<video autoplay loop="" muted="" playsinline="" poster="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_1_pc.jpg" src="/-/media/PioneerDj/Images/Features/Controller/DDJ-FLX10/KEY_FEATURE_IMAGE001_TRACK_SEPARATION_1053x1053.mp4"></video>
<a class="video-bg__control video-bg__control--right">
<span class="icon-media">
<span class="icon-media__inner">
<span class="icon-media__pause">
<svg class="icon-media__play" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z"></path>
</svg>
</span>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
<div class="col-two__item">
<div class="col-two__content">
<h2 class="col-two__heading heading heading--5 field-promotext">Track Separation for innovative performances including live mashups</h2>
<div class="col-two__item__description field-promotext2">
<p>Load the regular songs from your music library and create remixes and mash-ups on the fly by independently manipulating the 3 key parts of the music: vocals, drums, and inst (other instruments including bass and synths). There are dedicated color-coded buttons to control each part, so you’ll always have a clear visual grasp of what’s playing.</p>
<ul class="list-rotary">
<li>ACTIVE PART & PART ISO<br />
<small>Individually adjust the volume for the vocals, drums, or inst, or mute them completely.</small>
</li>
<li>FX PART SELECT<br />
<small>Choose which parts of a track you want to apply effects to.</small>
</li>
<li>PART INSTANT DOUBLES <br />
<small>Isolate a specific part of the track (vocal, drums, or inst) and transfer it to another deck.</small>
</li>
</ul>
</div>
<div class="gap--s--top-out-2"></div>
<div class="gap--s--top-out-4"></div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12" id="TutorialVideos">
<div class="component-content" id='default-text'>
<section class="col-one">
<div class="col-one__inner">
<div class="col-one__content field-text">
<div class="spacer spacer--3" id="trackseparation"></div>
<h2 class="section-header__heading heading heading--4" style="font-size: var(--h--6; font-weight: bold; text-align: center; text-transform: none;">See details of the Track Separation function</h2>
<div class="spacer spacer--5"></div>
<a rel="noopener noreferrer" href="https://rekordbox.com/en/recommend/livemashup/" target="_blank">
<img alt="Track Separation function detail" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/flx10_track-separation_banner.jpg" class="img-responsive lazyload" />
</a>
<br />
<br />
<br />
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12 col-two--reversed">
<div class="component-content" id='Content2'>
<section>
<div class="col-two__inner">
<div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content2'>
<div class="col-two__visual">
<div>
<picture class="visual">
<source media="(max-width: 748px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_2_sp.jpg">
<source media="(min-width: 751px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_2_pc.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_2_pc.jpg" alt="">
</picture>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
<div class="col-two__item">
<div class="col-two__content">
<h2 class="col-two__heading heading heading--5 field-promotext">Expanded On Jog Display</h2>
<div class="col-two__item__description field-promotext2">
<p>Customize the information you see on the jogs so there’s no need to take your eyes off the decks. Choose from 4 modes, some of which show 3 Band Waveforms (rekordbox only), and keep an eye on Mix Point Link and rekordbox vocal position analysis information, as well as Performance Pad status. </p>
<ul class="list-rotary">
<li>DECK INFO MODE<br />
<small>Shows the information about the deck, including the Overall Waveform. (When using Serato DJ Pro, this mode shows the virtual deck of Serato DJ Pro.)</small>
</li>
<li>WAVEFORM MODE<br />
<small>Shows the Zoomed Waveforms for 2 decks.</small>
</li>
<li>ARTWORK DISPLAY<br />
<small>Shows the artwork for the track that’s playing.</small>
</li>
<li>DJ LOGO DISPLAY<br />
<small>Shows your own logo or favorite image on each deck after using the Image Transfer Tool for PC/Mac.</small>
</li>
</ul>
</div>
<div class="gap--s--top-out-2"></div>
<div class="gap--s--top-out-4"></div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12">
<div class="component-content" id='Content3'>
<section>
<div class="col-two__inner">
<div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content3'>
<div class="col-two__visual">
<div class="video-player">
<div class="video-bg">
<video autoplay loop="" muted="" playsinline="" poster="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_3_pc.jpg" src="/-/media/PioneerDj/Images/Features/Controller/DDJ-FLX10/KEY_FEATURE_IMAGE002_MIX_POINT_LINK_1053x1053.mp4"></video>
<a class="video-bg__control video-bg__control--right">
<span class="icon-media">
<span class="icon-media__inner">
<span class="icon-media__pause">
<svg class="icon-media__play" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z"></path>
</svg>
</span>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
<div class="col-two__item">
<div class="col-two__content">
<h2 class="col-two__heading heading heading--5 field-promotext">New Mix Point Link for seamless transitions</h2>
<div class="col-two__item__description field-promotext2">
<p>Take advantage of a completely new playback concept in rekordbox that enables you to create slick musical progression in your sets by linking mix points in tracks so the next song kicks in at the perfect moment. You might set the next track to start from the beginning of its melody when the vocal of the current song ends, ensuring a seamless transition without a sound clash. There’s no need to count down or press play manually, which also leaves your hands free to create mash-ups or add effects.</p>
</div>
<div class="gap--s--top-out-2"></div>
<div class="gap--s--top-out-4"></div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12 col-two--reversed">
<div class="component-content" id='Content4'>
<section>
<div class="col-two__inner">
<div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content4'>
<div class="col-two__visual">
<div class="video-player">
<div class="video-bg">
<video autoplay loop="" muted="" playsinline="" poster="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_4_pc.jpg" src="/-/media/PioneerDj/Images/Features/Controller/DDJ-FLX10/KEY_FEATURE_IMAGE003_rekordboxLIGHTING_1053x1053.mp4"></video>
<a class="video-bg__control video-bg__control--right">
<span class="icon-media">
<span class="icon-media__inner">
<span class="icon-media__pause">
<svg class="icon-media__play" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z"></path>
</svg>
</span>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
<div class="col-two__item">
<div class="col-two__content">
<h2 class="col-two__heading heading heading--5 field-promotext">DMX output for rekordbox Lighting function</h2>
<div class="col-two__item__description field-promotext2">
<p>Liven up your performances with lighting effects that match the mood of the tracks you play. It’s easy with the rekordbox Lighting function and, thanks to the DMX output on the DDJ-FLX10, you don’t need any other equipment such as an external DMX interface. Simply connect DMX-compatible lighting equipment to the controller and use rekordbox to create custom lighting effects, or set the software to automatically adapt the color and movement of the lights to progress with the music.</p>
</div>
<div class="gap--s--top-out-2"></div>
<div class="gap--s--top-out-4"></div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12">
<div class="component-content" id='Content5'>
<section>
<div class="col-two__inner">
<div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content5'>
<div class="col-two__visual">
<div>
<picture class="visual">
<source media="(max-width: 748px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_5_sp.jpg">
<source media="(min-width: 751px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_5_pc.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_5_pc.jpg" alt="">
</picture>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
<div class="col-two__item">
<div class="col-two__content">
<h2 class="col-two__heading heading heading--5 field-promotext">Evolved MAGVEL FADER 4-sensor system</h2>
<div class="col-two__item__description field-promotext2">
<p>Improved from the 2-sensor system on the DDJ-1000, the MAGVEL FADER on the DDJ-FLX10 uses a 4-sensor system. This allows you to make the tiniest volume adjustments, no matter how small the movement of the crossfader, enabling more musical performances. </p>
</div>
<div class="gap--s--top-out-2"></div>
<div class="gap--s--top-out-4"></div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12 col-two--reversed">
<div class="component-content" id='Content6'>
<section>
<div class="col-two__inner">
<div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content6'>
<div class="col-two__visual">
<div>
<picture class="visual">
<source media="(max-width: 748px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_6_sp.jpg">
<source media="(min-width: 751px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_6_pc.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_6_pc.jpg" alt="">
</picture>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
<div class="col-two__item">
<div class="col-two__content">
<h2 class="col-two__heading heading heading--5 field-promotext">rekordbox and Serato DJ Pro compatibility</h2>
<div class="col-two__item__description field-promotext2">
<p>The DDJ-FLX10 offers free plug-and-play compatibility with rekordbox and Serato DJ Pro, giving you hands-on control of your favorite software application. DVS support is available for rekordbox via selected subscription plans, and for Serato via a paid license/subscription to Serato DJ Expansions or Serato DJ Suite. </p>
</div>
<div class="gap--s--top-out-2"></div>
<div class="gap--s--top-out-4"></div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12">
<div class="component-content" id='Content7'>
<section>
<div class="col-two__inner">
<div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content7'>
<div class="col-two__visual">
<div class="video-player">
<div class="video-bg">
<video autoplay loop="" muted="" playsinline="" poster="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_7_pc.jpg" src="/-/media/PioneerDj/Images/Features/Controller/DDJ-FLX10/KEY_FEATURE_IMAGE004_MULTICOLOR_JOG_1053x1053.mp4"></video>
<a class="video-bg__control video-bg__control--right">
<span class="icon-media">
<span class="icon-media__inner">
<span class="icon-media__pause">
<svg class="icon-media__play" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z"></path>
</svg>
</span>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
<div class="col-two__item">
<div class="col-two__content">
<h2 class="col-two__heading heading heading--5 field-promotext">Multicolored jog ring</h2>
<div class="col-two__item__description field-promotext2">
<p>You can use the first-ever multicolored jog ring on a Pioneer DJ controller to indicate the different parts of the track that are playing when you’re using the Track Separation features, or you can customize the colors to your preferred look. </p>
</div>
<div class="gap--s--top-out-2"></div>
<div class="gap--s--top-out-4"></div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12">
<div class="component-content" id='default-text'>
<section class="col-one">
<div class="col-one__inner">
<div class="col-one__content field-text">OTHER FEATURES</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--1"></div>
<div class="component content">
<div class="component-content" id='Overview'>
<div class="usp-small usp-small--col-two">
<div class="usp-small__inner">
<div class="usp-small__items">
<div class="component content usp-small__item">
<div class="component-content" id='Feature1'>
<div class="usp-snippet usp-snippet--C">
<div class="usp-snippet__visual">
<picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_web_small-feature_usb-type-c_1000x1000.png">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_web_small-feature_usb-type-c_1000x1000.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_web_small-feature_usb-type-c_1000x1000.png" alt="">
</picture>
</div>
<div class="usp-snippet__content">
<h4 class="usp-snippet__title heading heading--7 field-promotext"><strong>USB Type-C</strong></h4>
<p class="usp-snippet__text p--2 field-promotext2">Connect your PC/Mac directly to the controller’s USB Type-C terminal with a single cable.</p>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content usp-small__item">
<div class="component-content" id='Feature2'>
<div class="usp-snippet usp-snippet--C">
<div class="usp-snippet__visual">
<picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/mixer/djm-s11/small-serato-pnt-dj-icon.jpg">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/mixer/djm-s11/small-serato-pnt-dj-icon.jpg">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/mixer/djm-s11/small-serato-pnt-dj-icon.jpg" alt="">
</picture>
</div>
<div class="usp-snippet__content">
<h4 class="usp-snippet__title heading heading--7 field-promotext"><strong>Pitch 'n Time DJ</strong></h4>
<p class="usp-snippet__text p--2 field-promotext2">A voucher for the Serato Pitch ‘n Time DJ Expansion Pack is included, which enables key shifting and key syncing with perfect audio quality.</p>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content usp-small__item">
<div class="component-content" id='Feature3'>
<div class="usp-snippet usp-snippet--C">
<div class="usp-snippet__visual">
<picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/performance-pads.jpg">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/performance-pads.jpg">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/performance-pads.jpg" alt="">
</picture>
</div>
<div class="usp-snippet__content">
<h4 class="usp-snippet__title heading heading--7 field-promotext"><strong>Performance Pads</strong></h4>
<p class="usp-snippet__text p--2 field-promotext2">Hit the 8 back-lit rubber Performance Pads to trigger Hot Cues, Pad FX, Beat Jump, and the sampler.</p>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content usp-small__item">
<div class="component-content" id='Feature5'>
<div class="usp-snippet usp-snippet--C">
<div class="usp-snippet__visual">
<picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/landing/firmware-update-manager/d_w_1043.jpg">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/landing/firmware-update-manager/d_w_1043.jpg">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/landing/firmware-update-manager/d_w_1043.jpg" alt="">
</picture>
</div>
<div class="usp-snippet__content">
<h4 class="usp-snippet__title heading heading--7 field-promotext"><strong>Firmware Update Manager</strong></h4>
<p class="usp-snippet__text p--2 field-promotext2">You’ll be automatically notified when firmware updates become available. You can download the Firmware Update Manager <a href="/en/landing/firmware-update-manager/">here</a>.</p>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--15"></div>
<div class="component content section--9 col-xs-12">
<div class="component-content" id='Common'>
<section class="hotspots">
<div class="hotspots__inner">
<div class="hotspots__content">
<div>
<picture class="hotspots__visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_top_1.png">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_top_1.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_top_1.png" alt="">
</picture>
</div>
<div class="hotspots__spots">
<div class="component content col-xs-12">
<div class="component-content" id='hotspot1'>
<div><a class="hotspot" style="top: 84%; left: 14%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot1.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot1.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">Performance Pads</span>
<span class="hotspot__description caption">Call up and control the Hot Cues, Pad FX, Beat Jump, and sampler.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot2'>
<div><a class="hotspot" style="top: 5%; left: 31.5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot2.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot2.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">Call Cue/ Loop section</span>
<span class="hotspot__description caption">Calls the memory cues and loops already set for the track.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot3'>
<div><a class="hotspot" style="top: 6%; left: 7%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot3.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot3.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">ACTIVE PART</span>
<span class="hotspot__description caption">Turns mute on/off for the drums, vocal, and inst parts. You can change the function from mute to solo via the settings in rekordbox.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot4'>
<div><a class="hotspot" style="top: 67%; left: 95%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot4.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot4.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">Beat FX section</span>
<span class="hotspot__description caption">A Beat FX section with the same feel as the DJM Series.
A new effect, Stretch, creates the sound of the audio stretching.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot5'>
<div><a class="hotspot" style="top: 50%; left: 92.5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot5.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot5.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">FX PART SELECT</span>
<span class="hotspot__description caption">Select a part to be applied with an effect when using Beat FX or Sound Color FX. The effect applies to the parts which are lit.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot6'>
<div><a class="hotspot" style="top: 17%; left: 31.5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot6.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot6.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">MIX POINT LINK</span>
<span class="hotspot__description caption">You can use this function to mix to your next track easily by setting the start and end points on the track for On Air.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot7'>
<div><a class="hotspot" style="top: 55%; left: 74%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot7.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot7.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">PART ISO switch</span>
<span class="hotspot__description caption">Individually adjust the volume for the vocals, drums, or inst.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot8'>
<div><a class="hotspot" style="top: 45%; left: 25%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot8.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot8.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">ON JOG DISPLAY</span>
<span class="hotspot__description caption">As well as switching between 4 different modes that can display waveforms and artwork, it can display various parameters from rekordbox to help with your performance.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot9'>
<div><a class="hotspot" style="top: 89%; left: 73.5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot9.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot9.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">MAGVEL FADER</span>
<span class="hotspot__description caption">The DDJ-FLX10 is the first controller in our lineup to include a 4-sensor MAGVEL FADER. This enables you to adjust the volume more precisely.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot10'>
<div><a class="hotspot" style="top: 38%; left: 42%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot10.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot10.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">MULTICOLOR JOG RING</span>
<span class="hotspot__description caption">The jog rings change in color to match the Active Part function or the color set by you.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='hotspot11'>
<div><a class="hotspot" style="top: 76%; left: 43%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot11.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot11.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">TEMPO RESET button</span>
<span class="hotspot__description caption">Turning the button on resets the BPM of the track to its original tempo.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='hotspot12'>
<div><a class="hotspot" style="top: 68%; left: 5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot12.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot12.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">BEAT JUMP button</span>
<span class="hotspot__description caption">By pressing the [BEAT JUMP] button, you can instantly move the playback position while keeping the beat of the track in time.
You can move 4 beats or 16 beats if you press [SHIFT].</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--3"></div>
<div class="component content section--9 col-xs-12">
<div class="component-content" id='Common 2'>
<section class="hotspots">
<div class="hotspots__inner">
<div class="hotspots__content">
<div>
<picture class="hotspots__visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_rear_1.png">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_rear_1.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_rear_1.png" alt="">
</picture>
</div>
<div class="hotspots__spots">
<div class="component content col-xs-12">
<div class="component-content" id='hotspot-rear3'>
<div><a class="hotspot" style="top: 66%; left: 62%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">DMX Output Terminal</span>
<span class="hotspot__description caption">The DMX terminal is compatible with rekordbox Lighting mode.
By connecting your lighting equipment, the color and brightness of the lights will automatically change to match the music.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='hotspot-rear5'>
<div><a class="hotspot" style="top: 65%;left: 71%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">USB port (Type C)</span>
<span class="hotspot__description caption">Connection for a PC/Mac.</span>
</span>
</span>
</a></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12" id="TutorialVideos">
<div class="component-content" id='default-text'>
<section class="col-one">
<div class="col-one__inner">
<div class="col-one__content field-text">
<div class="spacer spacer--15" id="spec"></div>
<h2 class="section-header__heading heading heading--4" style="font-size: var(--h--4); font-weight: bold; text-align: center;">SPECIFICATIONS</h2>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--0"></div>
<div class="component content spec-scroll">
<div class="component-content" id='Overview'>
<div class="specs">
<div class="specs__inner">
<div class="specs__table">
<div class="table">
<div class="component content">
<div class="component-content" id='Row1'>
<div class="table__row">
<div class="table__cell"><strong class="field-promotext">Width</strong></div>
<div class="table__cell field-promotext2">716 mm</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='Row2'>
<div class="table__row">
<div class="table__cell"><strong class="field-promotext">Height</strong></div>
<div class="table__cell field-promotext2">73.4 mm</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='Row3'>
<div class="table__row">
<div class="table__cell"><strong class="field-promotext">Depth</strong></div>
<div class="table__cell field-promotext2">400.3 mm</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='Row4'>
<div class="table__row">
<div class="table__cell"><strong class="field-promotext">Weight</strong></div>
<div class="table__cell field-promotext2">6.7 kg</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="specs__actions actions actions--start actions--m--end actions--force">
<div class="actions__item">
<a href="/en/landing/comparison/dj-controller/" class="link link--underlined">
<span class="link__label">Compare</span>
</a>
</div>
<div class="actions__item">
<a href="/en/product/controller/ddj-flx10/black/specifications/" class="action action--normal action--on-light" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'See all specs', 'dlLabel': '', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/specifications/'});">
<span class="action__bg"></span>
<span class="action__label">See all specs</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--20"></div>
<section class="media media--grid">
<div class="media__in">
<div class="media__inner">
<div class="media__content">
<div class="media__item">
<div class="media__item__inner">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_1.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_1.jpg" alt="">
</picture>
</div>
</div>
<div class="media__item">
<div class="media__item__inner">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_2.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_2.jpg" alt="">
</picture>
</div>
</div>
<div class="media__item">
<div class="media__item__inner">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_3.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_3.jpg" alt="">
</picture>
</div>
</div>
</div>
</div>
<div class="media__loadmore">
<a href="/api/sitecore/Product/GenerateJson?ItemId=a3f92fdd-27b2-4af5-9f87-269d6e706d20&page=" class="loadmore" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Load more', 'dlLabel': 'Images', 'dlPosition': '', 'dlURL': ''});">
<span class="loadmore__icon">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span>
</span>
<span class="loadmore__label p--1">load more media</span>
</a>
</div>
</div>
</section>
<div class="spacer spacer--20"></div>
<div class="combine-with combine-with--tabs">
<div class="combine-with__in">
<div class="combine-with__header">
<div class="combine-with__labels swiper-container">
<div class="swiper-wrapper">
<div class="combine-with__label swiper-slide">OTHER CONTROLLERS</div>
<div class="combine-with__label swiper-slide">COMBINE WITH</div>
</div>
</div>
</div>
<div class="combine-with__main swiper-container">
<div class="swiper-wrapper">
<div class="combine-with__item swiper-slide">
<div class="combine-with__carousel">
<section class="carousel swiper-container">
<div class="swiper-wrapper">
<!--carousel-->
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/controller/ddj-flx6-gt/graphite/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DDJ-FLX6-GT', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx6-gt/graphite/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx6-gt/pc-cgi_top.png?h=250&w=400&hash=C13FB1BDF9EDBFA4284CD8D105D763C8" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/controller/ddj-flx6-gt/graphite/overview/" class="link link--default">
<span class="link__label">DDJ-FLX6-GT</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
4-channel DJ controller for multiple DJ applications
</div>
</div>
<!--Buynow-->
</article>
</div>
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/controller/ddj-flx4/black/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DDJ-FLX4', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx4/black/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx4/pc-cgi_top.png?h=250&w=400&hash=512BD81B4009070AC985887FC3599CF1" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/controller/ddj-flx4/black/overview/" class="link link--default">
<span class="link__label">DDJ-FLX4</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
2-channel DJ controller for multiple DJ applications
</div>
</div>
<!--Buynow-->
</article>
</div>
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/controller/ddj-rev1/black/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DDJ-REV1', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-rev1/black/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-rev1/ddj-rev1_prm_top_1792x1316_pc.png?h=250&w=400&hash=12A3ED7B0F78CFF69709E28C714B8990" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/controller/ddj-rev1/black/overview/" class="link link--default">
<span class="link__label">DDJ-REV1</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
Scratch-style 2-channel DJ controller for Serato DJ Lite
</div>
</div>
<!--Buynow-->
</article>
</div>
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/controller/ddj-rev7/black/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DDJ-REV7', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-rev7/black/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-rev7/at-care_category_ddj-rev7-2_1792x1316b.png?h=250&w=400&hash=579D1596F95E0BDF12A07C4980F45FCE" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/controller/ddj-rev7/black/overview/" class="link link--default">
<span class="link__label">DDJ-REV7</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
Scratch-style 2-channel professional DJ controller for Serato DJ Pro
</div>
</div>
<!--Buynow-->
</article>
</div>
</div>
<nav class="carousel__nav">
<div class="carousel__nav__item">
<a class="carousel__nav__link carousel__nav__link--prev" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Related products', 'dlLabel': 'Left', 'dlPosition': '', 'dlURL': ''});">
<span class="carousel__nav__icon">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 9.7 16">
<path fill="currentColor" d="M0.4,0.4C0.8-0.1,1.5-0.1,2,0.3L2,0.4L9.7,8L2,15.6c-0.5,0.5-1.2,0.5-1.7,0c-0.4-0.4-0.5-1.1-0.1-1.6l0.1-0.1L6.3,8L0.4,2C-0.1,1.6-0.1,0.9,0.4,0.4L0.4,0.4z" />
</svg>
</span>
</a>
</div>
<div class="carousel__nav__item">
<a class="carousel__nav__link carousel__nav__link--next" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Related products', 'dlLabel': 'Right', 'dlPosition': '', 'dlURL': ''});">
<span class="carousel__nav__icon">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 9.7 16">
<path fill="currentColor" d="M0.4,0.4C0.8-0.1,1.5-0.1,2,0.3L2,0.4L9.7,8L2,15.6c-0.5,0.5-1.2,0.5-1.7,0c-0.4-0.4-0.5-1.1-0.1-1.6l0.1-0.1L6.3,8L0.4,2C-0.1,1.6-0.1,0.9,0.4,0.4L0.4,0.4z" />
</svg>
</span>
</a>
</div>
</nav>
</section>
</div>
</div>
<div class="combine-with__item swiper-slide">
<div class="combine-with__carousel">
<section class="carousel swiper-container">
<div class="swiper-wrapper">
<!--carousel-->
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/accessories/djc-flx10-bag/black/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DJC-FLX10 BAG', 'dlPosition': '', 'dlURL': '/en/product/accessories/djc-flx10-bag/black/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/accessories/djc-flx10-bag/flx-10-case_closed2.png?h=250&w=400&hash=AB8E52D3046F31C3DF267F44248C0DFA" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/accessories/djc-flx10-bag/black/overview/" class="link link--default">
<span class="link__label">DJC-FLX10 BAG</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
DJ controller bag for the DDJ-FLX10
</div>
</div>
<!--Buynow-->
</article>
</div>
</div>
<nav class="carousel__nav">
<div class="carousel__nav__item">
<a class="carousel__nav__link carousel__nav__link--prev" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Related products', 'dlLabel': 'Left', 'dlPosition': '', 'dlURL': ''});">
<span class="carousel__nav__icon">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 9.7 16">
<path fill="currentColor" d="M0.4,0.4C0.8-0.1,1.5-0.1,2,0.3L2,0.4L9.7,8L2,15.6c-0.5,0.5-1.2,0.5-1.7,0c-0.4-0.4-0.5-1.1-0.1-1.6l0.1-0.1L6.3,8L0.4,2C-0.1,1.6-0.1,0.9,0.4,0.4L0.4,0.4z" />
</svg>
</span>
</a>
</div>
<div class="carousel__nav__item">
<a class="carousel__nav__link carousel__nav__link--next" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Related products', 'dlLabel': 'Right', 'dlPosition': '', 'dlURL': ''});">
<span class="carousel__nav__icon">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 9.7 16">
<path fill="currentColor" d="M0.4,0.4C0.8-0.1,1.5-0.1,2,0.3L2,0.4L9.7,8L2,15.6c-0.5,0.5-1.2,0.5-1.7,0c-0.4-0.4-0.5-1.1-0.1-1.6l0.1-0.1L6.3,8L0.4,2C-0.1,1.6-0.1,0.9,0.4,0.4L0.4,0.4z" />
</svg>
</span>
</a>
</div>
</nav>
</section>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12">
<div class="component-content" id='default-text'>
<section class="col-one">
<div class="col-one__inner">
<div class="col-one__content field-text">
<style type="text/css">
<!--
section.col-one .col-one__inner .col-one__content.field-text {
text-align: center;
padding-top: 10px;
}
.combine-with {
margin-top: 30px;
}
.col-two__content {
padding: 30px 15px 40px;
}
.hero-product__description,
p.usp-snippet__text.p--2.field-promotext2 {
letter-spacing: 0.1px;
}
.col-one__inner {
max-width: 1140px;
}
#the-bucket .section--9 {
max-width: 1170px;
}
section.col-one .media {
padding: 0;
}
section.media.media--grid.media--grid--B .media__item.in-view {
max-height: 320px;
margin-bottom: 4px;
}
section.media.media--grid.media--grid--B .video-player {
max-height: 320px;
}
section.media.media--grid.media--grid--B .in-view .media__item__inner {
background: #FFF;
}
.icon-play__inner {
/* opacity: 0.6; */
}
.combine-with__visual {
display: none;
}
div#videos {
/* display: block; */
/* padding-top: 150px; */
/* margin-top: -150px; */
}
#TutorialVideos .col-one__content {
max-width: 1170px !important;
/* padding: 0 var(--gutter--bucket) 0 0; */
}
#seeallvideos .col-one__content {
max-width: 1170px !important;
/* padding: 0 var(--gutter--bucket) 0 0; */
}
.col-one:not(.col-one--visual) .col-one__content {
font-size: var(--h--4) !important;
}
-->
</style>
</div>
</div>
</section>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--30"></div>
<div class="component content back-to-top">
<div class="component-content" id='back-to-top'>
<div class="back-to-top__link">back to top <span class="back-to-top__arrow"></span></div>
</div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function() {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function(element) {
element.addEventListener('click', function(e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
<!--BEGIN QUALTRICS WEBSITE FEEDBACK SNIPPET-->
<script type='text/javascript'>
(function() {
var g = function(e, h, f, g) {
this.get = function(a) {
for (var a = a + "=", c = document.cookie.split(";"), b = 0, e = c.length; b < e; b++) {
for (var d = c[b];
" " == d.charAt(0);) d = d.substring(1, d.length);
if (0 == d.indexOf(a)) return d.substring(a.length, d.length)
}
return null
};
this.set = function(a, c) {
var b = "",
b = new Date;
b.setTime(b.getTime() + 6048E5);
b = "; expires=" + b.toGMTString();
document.cookie = a + "=" + c + b + "; path=/; "
};
this.check = function() {
var a = this.get(f);
if (a) a = a.split(":");
else if (100 != e) "v" == h && (e = Math.random() >= e / 100 ? 0 : 100), a = [h, e, 0], this.set(f, a.join(":"));
else return !0;
var c = a[1];
if (100 == c) return !0;
switch (a[0]) {
case "v":
return !1;
case "r":
return c = a[2] % Math.floor(100 / c), a[2]++, this.set(f, a.join(":")), !c
}
return !0
};
this.go = function() {
if (this.check()) {
var a = document.createElement("script");
a.type = "text/javascript";
a.src = g;
document.body && document.body.appendChild(a)
}
};
this.start = function() {
var t = this;
"complete" !== document.readyState ? window.addEventListener ? window.addEventListener("load", function() {
t.go()
}, !1) : window.attachEvent && window.attachEvent("onload", function() {
t.go()
}) : t.go()
};
};
try {
(new g(100, "r", "QSI_S_ZN_bguvlNheEQIvQBU", "https://znbguvlnheeqivqbu-pioneerdj.siteintercept.qualtrics.com/SIE/?Q_ZID=ZN_bguvlNheEQIvQBU")).start()
} catch (i) {}
})();
</script>
<div id='ZN_bguvlNheEQIvQBU'><!--DO NOT REMOVE-CONTENTS PLACED HERE--></div>
<!--END WEBSITE FEEDBACK SNIPPET-->
<footer class="footer theme-2020">
<div class="footer__brand">
<div class="footerBrand">
<div class="footerBrand__logo">
<svg class="symbol symbol--dj" viewBox="0 0 39 25" version="1" xmlns="http://www.w3.org/2000/svg">
<path d="M25.122 2.049c2.395 1.86 2.787 4.38 1.8 7.019-.919 2.442-2.98 4.81-6.22 6.642-3.592 1.994-7.308 2.525-11.363 2.525H0L6.844 0h8.209c4.14 0 7.638.164 10.069 2.049zm-5.057 6.883c.538-1.437.4-3.579-.552-4.723-1.07-1.27-2.719-1.419-5.1-1.419l-1.163.026s-1-.113-1.407.796c-.248.57.104-.426-3.92 10.305-.53 1.423.735 1.493.735 1.493s4.54.277 8.34-2.352c1.61-1.114 2.562-2.772 3.067-4.126zm9.65-2.385L39 6.594l-4.7 12.564C32.767 23.25 29.594 25 23.231 25l-4.969-.066 1.188-2.837c7.193.343 8.49-2.86 8.717-3.475l3-8.07s.516-1.437-.652-1.437h-1.84l1.04-2.568z" fill="currentColor"></path>
</svg>
</div>
<nav class="footerBreadcrumb">
<ul class="footerBreadcrumb__list">
<li class="footerBreadcrumb__item">
<a href='https://preprod.pioneerdj.com/en/product/' class="footerBreadcrumb__link">Product</a>
</li>
<li class="footerBreadcrumb__item">
<a href='https://preprod.pioneerdj.com/en/product/controller/' class="footerBreadcrumb__link">DJ Controller</a>
</li>
<li class="footerBreadcrumb__item">
<a href='https://preprod.pioneerdj.com/en/product/controller/ddj-flx10/' class="footerBreadcrumb__link">DDJ-FLX10</a>
</li>
<li class="footerBreadcrumb__item">
Overview </li>
</ul>
</nav>
</div>
</div>
<div class="footer__nav">
<nav class="footerNav">
<div class="footerNav__content">
<h3 class="footerNav__title heading heading--4">
<a href="/en/product/" class="footerNav__title__link">Products</a>
<span class="footerNav__trigger footerNav__triggerIcon"></span>
</h3>
<div class="footerNav__menu" style="height: 264px;">
<ul class="footerNav__list">
<li class="footerNav__item"><a href="/en/product/player/" class="footerNav__link">DJ Players / Turntables</a></li>
<li class="footerNav__item"><a href="/en/product/mixer/" class="footerNav__link">DJ mixers</a></li>
<li class="footerNav__item"><a href="/en/product/all-in-one-system/" class="footerNav__link">All-in-one DJ systems</a></li>
<li class="footerNav__item"><a href="/en/product/controller/" class="footerNav__link">DJ controllers</a></li>
<li class="footerNav__item"><a href="/en/product/software/" class="footerNav__link">Softwares / Interfaces</a></li>
<li class="footerNav__item"><a href="/en/product/dj-sampler/" class="footerNav__link">DJ samplers</a></li>
<li class="footerNav__item"><a href="/en/product/effector/" class="footerNav__link">DJ effectors</a></li>
<li class="footerNav__item"><a href="/en/product/production/" class="footerNav__link">Music production</a></li>
<li class="footerNav__item"><a href="/en/product/headphones/" class="footerNav__link">Headphones</a></li>
<li class="footerNav__item"><a href="/en/product/monitor-speakers/" class="footerNav__link">Monitor speakers</a></li>
<li class="footerNav__item"><a href="https://www.alphatheta.com/product/portable-dj-speaker/wave-eight/black/" class="footerNav__link" rel="noopener noreferrer" target="_blank">Portable DJ Speakers</a></li>
<li class="footerNav__item"><a href="/en/product/pa-speakers/" class="footerNav__link">PA speakers</a></li>
<li class="footerNav__item"><a href="/en/product/accessories/" class="footerNav__link">Accessories</a></li>
</ul>
</div>
</div>
<div class="footerNav__content">
<h3 class="footerNav__title heading heading--4">
<a href="/en/support/" class="footerNav__title__link">Support</a>
<span class="footerNav__trigger footerNav__triggerIcon"></span>
</h3>
<div class="footerNav__menu" style="height: 192px;">
<ul class="footerNav__list">
<li class="footerNav__item">
<a href="/en/support/contact/" class="footerNav__link" title="Contact">Contact</a>
</li>
<li class="footerNav__item">
<a href="/en/support/documents/" class="footerNav__link">Manuals</a>
</li>
<li class="footerNav__item">
<a href="/en/support/software/" class="footerNav__link">Software & firmware</a>
</li>
<li class="footerNav__item">
<a href="/en/support/software-information/" class="footerNav__link">Software information</a>
</li>
<li class="footerNav__item">
<a href="http://faq.pioneerdj.com" class="footerNav__link" rel="noopener noreferrer" target="_blank">FAQ <span class="footerNav__icon"><svg class="symbol symbol--external" viewBox="0 0 32 32" version="1" xmlns="http://www.w3.org/2000/svg">
<path d="M20 0l3.2 3.2H1.6C.8 3.2 0 4 0 4.96V30.4c0 .8.8 1.6 1.6 1.6h24.8c.96 0 1.6-.8 1.6-1.76V8.48l.16-.16 3.84 4V0H20zm4.8 28.64H3.36V6.56h17.76l-12 12.32 4.48 4.48 11.2-11.52v16.8z" fill="currentColor"></path>
</svg></span>
</a>
</li>
<li class="footerNav__item">
<a href="https://community.pioneerdj.com/" class="footerNav__link" rel="noopener noreferrer" target="_blank">Forum <span class="footerNav__icon"><svg class="symbol symbol--external" viewBox="0 0 32 32" version="1" xmlns="http://www.w3.org/2000/svg">
<path d="M20 0l3.2 3.2H1.6C.8 3.2 0 4 0 4.96V30.4c0 .8.8 1.6 1.6 1.6h24.8c.96 0 1.6-.8 1.6-1.76V8.48l.16-.16 3.84 4V0H20zm4.8 28.64H3.36V6.56h17.76l-12 12.32 4.48 4.48 11.2-11.52v16.8z" fill="currentColor"></path>
</svg></span>
</a>
</li>
<li class="footerNav__item">
<a href="/en/landing/pioneer-dj-certified/" class="footerNav__link">Certification program</a>
</li>
<li class="footerNav__item">
<a href="/en/account/about/" class="footerNav__link">About your account</a>
</li>
<li class="footerNav__item">
<a href="/en/support/important-product-notice/" class="footerNav__link">Important product notices</a>
</li>
</ul>
</div>
</div>
<div class="footerNav__content">
<h3 class="footerNav__title heading heading--4">
<a href="/en/news/" class="footerNav__title__link" title="News">News</a>
</h3>
<h3 class="footerNav__title heading heading--4">
<a href="https://alphatheta.com/en/company/" class="footerNav__title__link" rel="noopener noreferrer" target="_blank">About us</a>
<span class="footerNav__trigger footerNav__triggerIcon"></span>
</h3>
<div class="footerNav__menu" style="height: 48px;">
<ul class="footerNav__list">
<li class="footerNav__item"><a href="https://alphatheta.com/en/company/#company-info" class="footerNav__link" rel="noopener noreferrer" target="_blank">Company info</a></li>
<li class="footerNav__item"><a href="https://alphatheta.com/en/company/#company-info" class="footerNav__link" rel="noopener noreferrer" target="_blank">Corporate contact</a></li>
</ul>
</div>
</div>
</nav>
</div>
<div class="footer__nav">
<div class="footer-ext-nav">
<div class="footer-ext-nav__inner">
<ul class="footer-ext-nav__list footer-ext-nav__list--brands">
<li>
<a href="https://alphatheta.com/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 117 18.7" width="117" height="18.7">
<title>AlphaTheta</title>
<path fill="currentColor" d="m32.28 2.62 4.89 12.69h-2.38l-1.19-3.36h-5.06l-1.19 3.36h-2.29l4.87-12.69h2.36ZM31.05 4.8l-1.92 5.45H33L31.1 4.8h-.05Zm9.47-2.18v12.69h-2.03V2.62h2.03Zm11.18 8.14c0 2.42-1.21 4.8-3.96 4.8-1.15 0-2.45-.41-3.07-1.44h-.04v4.58H42.6V6.12h1.92v1.24h.04c.59-1.07 1.67-1.49 2.84-1.49 2.88 0 4.3 2.2 4.3 4.89Zm-4.57 3.19c1.83 0 2.54-1.63 2.54-3.23s-.76-3.25-2.56-3.25c-1.88 0-2.56 1.6-2.56 3.25s.78 3.23 2.58 3.23Zm7.95-11.33v4.71h.04c.59-.92 1.62-1.46 2.77-1.46 2.11 0 3.23 1.23 3.23 3.06v6.38h-2.03V9.62c0-1.17-.36-2.15-1.79-2.15s-2.22 1.16-2.22 2.36v5.47h-2.03V2.62h2.03Zm15.69 5.86v4.83c0 .48.11.64.55.64.11 0 .28 0 .43-.04v1.4c-.52.14-1.05.23-1.28.23-.89 0-1.42-.36-1.56-1.12-.73.73-2.06 1.12-3.18 1.12-1.81 0-3.15-1-3.15-2.68s1.01-2.4 2.38-2.68c.69-.14 1.46-.23 2.31-.34 1.23-.14 1.6-.43 1.6-1.14 0-.8-.64-1.24-1.9-1.24s-1.94.53-2.03 1.46h-2.03c.14-2.01 1.6-3.06 4.18-3.06 2.22 0 3.68 1.05 3.68 2.61Zm-4.43 5.47c1.39 0 2.4-.69 2.4-1.69V10.7c-.55.34-.82.34-2.22.52-1.33.16-1.92.64-1.92 1.47 0 .76.64 1.26 1.74 1.26ZM81.41 2.62v1.92h-4.03v10.77h-2.22V4.54h-4.02V2.62h10.27Zm3.04 0v4.71h.04c.59-.92 1.62-1.46 2.77-1.46 2.11 0 3.23 1.23 3.23 3.06v6.38h-2.03V9.62c0-1.17-.36-2.15-1.79-2.15s-2.22 1.16-2.22 2.36v5.47h-2.03V2.62h2.03Zm16.19 7.92c0 .23-.02.46-.04.69h-6.75c0 1.51.87 2.72 2.47 2.72 1.12 0 1.87-.46 2.24-1.53h1.92c-.41 1.97-2.15 3.13-4.16 3.13-2.9 0-4.5-2.03-4.5-4.82s1.71-4.87 4.44-4.87c2.59 0 4.37 2.13 4.37 4.67Zm-2.07-.64c-.11-1.28-.94-2.43-2.33-2.43s-2.33 1.08-2.4 2.43h4.73Zm6.21-6.54v2.75h1.83v1.51h-1.83v5.01c0 .96.23 1.16 1.01 1.16.37 0 .75-.04.82-.07v1.56c-.8.09-1.03.11-1.31.11-1.94 0-2.54-.62-2.54-2.47V7.63h-1.53V6.12h1.53V3.37h2.03Zm11.24 5.12v4.83c0 .48.11.64.55.64.11 0 .28 0 .43-.04v1.4c-.52.14-1.05.23-1.28.23-.89 0-1.42-.36-1.56-1.12-.73.73-2.06 1.12-3.18 1.12-1.81 0-3.14-1-3.14-2.68s1.01-2.4 2.38-2.68c.69-.14 1.46-.23 2.31-.34 1.23-.14 1.6-.43 1.6-1.14 0-.8-.64-1.24-1.9-1.24s-1.94.53-2.03 1.46h-2.03c.14-2.01 1.6-3.06 4.18-3.06 2.22 0 3.68 1.05 3.68 2.61Zm-4.42 5.47c1.39 0 2.4-.69 2.4-1.69V10.7c-.55.34-.82.34-2.22.52-1.33.16-1.92.64-1.92 1.47 0 .76.64 1.26 1.74 1.26ZM18.46 1.35C15.26-1.26 10.62.22 7.85 3.19c-.37.4-.71.84-1.03 1.3 1.61-2.12 4.01-3.46 6.35-3.28 3.44.26 5.42 3.69 4.44 7.66-.98 3.97-4.56 6.98-8 6.72-3.08-.23-4.99-3-4.65-6.43 1.03-.57 2.18-.78 3.21-.51 2.02.54 2.86 2.75 1.95 5 .29-.64.49-1.31.55-1.96.03-.29.03-.58 0-.88-.18-2.24-1.97-4.18-4.93-3.68-4.78.81-7.31 6.14-4.68 9.28 1.61 1.91 4.48 1.63 6.52.27 1.58 1.12 3.75 1.51 6.26.58 7.28-2.69 9.66-11.77 4.61-15.9ZM4.31 17.12c-2.09-.56-2.92-2.91-1.85-5.25.53-1.16 1.43-2.1 2.45-2.68-.14.81-.18 1.62-.11 2.39l.06.53c.04.29.11.57.18.85.41 1.48 1.26 2.79 2.46 3.66-1.02.56-2.17.77-3.2.5Z"></path>
</svg></a>
</li>
<li>
<a href="https://rekordbox.com/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 124 17.156" width="124" height="17.156">
<title>rekordbox</title>
<path fill="currentColor" d="M12.479 7.167a4.932 4.932 0 0 1 .265 1.6 4.983 4.983 0 0 1-4 4.887v3.507l6.14-3.545a1.272 1.272 0 0 0 .635-1.1v-7.1l-3.04 1.751m-8.454-1.7a4.969 4.969 0 0 1 7.465 0l3.038-1.755L8.393.17a1.279 1.279 0 0 0-1.275 0L.978 3.716l3.036 1.755ZM2.772 8.762a4.905 4.905 0 0 1 .265-1.6L0 5.41v7.09a1.279 1.279 0 0 0 .635 1.1l6.14 3.545v-3.501a4.977 4.977 0 0 1-4-4.887Zm7.482 0a2.493 2.493 0 0 1-2.49 2.5h-.006a2.494 2.494 0 0 1-2.5-2.491v-.009a2.493 2.493 0 0 1 2.496-2.495 2.494 2.494 0 0 1 2.5 2.491ZM81.746.186v3.391h-3.992a15.888 15.888 0 0 0-2.558.21 2.958 2.958 0 0 0-2.313 2.745 23.086 23.086 0 0 0 0 4.461 2.964 2.964 0 0 0 2.317 2.745 16 16 0 0 0 2.558.209q3.3 0 6.609.012V.186Zm0 11.68h-3.214c-2.783 0-3.142-.353-3.142-3.109s.359-3.109 3.142-3.109h3.214Zm16.278-5.34a2.961 2.961 0 0 0-2.313-2.744 15.875 15.875 0 0 0-2.557-.21h-3.992V.186h-2.617v13.762q3.3 0 6.609-.012a15.324 15.324 0 0 0 2.557-.209 2.957 2.957 0 0 0 2.313-2.745 23.1 23.1 0 0 0 0-4.462Zm-5.649 5.339h-3.213V5.648h3.213c2.783 0 3.142.353 3.142 3.109s-.359 3.109-3.142 3.109ZM62.96 6.477a3.135 3.135 0 0 0-2.694-2.745 21.117 21.117 0 0 0-5.952 0 3.129 3.129 0 0 0-2.695 2.745 21.1 21.1 0 0 0 0 4.577 3.135 3.135 0 0 0 2.694 2.746 21.124 21.124 0 0 0 5.953 0 3.131 3.131 0 0 0 2.694-2.745 21.1 21.1 0 0 0 0-4.577m-2.584 3.959a1.385 1.385 0 0 1-.778 1.209 2.476 2.476 0 0 1-1.2.243 19.051 19.051 0 0 1-2.755-.039 1.4 1.4 0 0 1-1.266-.833 2.559 2.559 0 0 1-.213-1.117 19.263 19.263 0 0 1 .036-2.822 1.385 1.385 0 0 1 .778-1.209 2.556 2.556 0 0 1 1.2-.243 19.065 19.065 0 0 1 2.756.039 1.4 1.4 0 0 1 1.264.833 2.545 2.545 0 0 1 .21 1.116 19.988 19.988 0 0 1-.039 2.822m50.763-3.959a3.136 3.136 0 0 0-2.695-2.745 21.117 21.117 0 0 0-5.952 0A3.131 3.131 0 0 0 99.8 6.477a21.1 21.1 0 0 0 0 4.577 3.137 3.137 0 0 0 2.695 2.745 21.117 21.117 0 0 0 5.952 0 3.132 3.132 0 0 0 2.695-2.745 21.1 21.1 0 0 0 0-4.577m-2.584 3.959a1.388 1.388 0 0 1-.779 1.209 2.47 2.47 0 0 1-1.2.243 19.2 19.2 0 0 1-2.756-.039 1.4 1.4 0 0 1-1.265-.833 2.544 2.544 0 0 1-.209-1.116 19.126 19.126 0 0 1 .038-2.822 1.386 1.386 0 0 1 .779-1.209 2.552 2.552 0 0 1 1.2-.243 19.061 19.061 0 0 1 2.756.039 1.4 1.4 0 0 1 1.265.833 2.544 2.544 0 0 1 .209 1.116 20.13 20.13 0 0 1-.038 2.822m-39.6-4.711a1.7 1.7 0 0 0-.585.193 2.176 2.176 0 0 0-.343.244 1.276 1.276 0 0 0-.315.447 2.159 2.159 0 0 0-.132.7c-.044.507-.033 1.016-.033 1.529v5.108h-2.663V8.757a20.108 20.108 0 0 1 .122-2.231 2.521 2.521 0 0 1 .314-1.049 3.161 3.161 0 0 1 .641-.861 3.3 3.3 0 0 1 .922-.608 5.114 5.114 0 0 1 1.32-.3 10.471 10.471 0 0 1 1.1-.083c.734-.028 2.529-.067 2.529-.067v2.079a24.756 24.756 0 0 0-2.883.088m-44.766 0a1.7 1.7 0 0 0-.585.193 2.176 2.176 0 0 0-.343.244 1.263 1.263 0 0 0-.315.447 2.159 2.159 0 0 0-.132.7c-.044.507-.033 1.016-.033 1.529v5.108h-2.657V8.757a20.108 20.108 0 0 1 .122-2.231 2.508 2.508 0 0 1 .315-1.049 3.146 3.146 0 0 1 .641-.861 3.29 3.29 0 0 1 .921-.608 5.124 5.124 0 0 1 1.32-.3 10.471 10.471 0 0 1 1.1-.083c.734-.028 2.528-.067 2.528-.067v2.079a24.74 24.74 0 0 0-2.882.088m21.783 3.037 5.268-5.185h-2.893l-3.86 4.147h-.276V3.577h-2.634v10.371h2.634V9.8h.27l3.866 4.153h2.893l-5.273-5.191h.005ZM124 3.577h-2.893l-3.313 3.612-3.319-3.612h-2.893l4.759 5.185-4.759 5.186h2.893l3.319-3.611 3.313 3.611H124l-4.76-5.186Zm-84.519 7.317h-2.628c-.022.077-.066.22-.066.22a.924.924 0 0 1-.879.691 19.313 19.313 0 0 1-4.218 0 1.046 1.046 0 0 1-.928-.911c-.061-.554-.1-1.111-.116-1.668h8.945v-.309a20.083 20.083 0 0 0-.121-2.452 3.135 3.135 0 0 0-2.694-2.745 21.124 21.124 0 0 0-5.953 0 3.131 3.131 0 0 0-2.695 2.745 21.1 21.1 0 0 0 0 4.578 3.135 3.135 0 0 0 2.695 2.744 21.043 21.043 0 0 0 5.952 0 2.912 2.912 0 0 0 .387-.077c.127-.033.248-.078.37-.122a3.142 3.142 0 0 0 .961-.613 2.321 2.321 0 0 0 .259-.276 2.926 2.926 0 0 0 .414-.635 2.835 2.835 0 0 0 .2-.513 3.679 3.679 0 0 0 .1-.541c0-.033.011-.067.011-.105v-.011m-8.709-4.285a1.044 1.044 0 0 1 .927-.911 19.2 19.2 0 0 1 4.219 0 1.044 1.044 0 0 1 .928.91c.039.354.072.7.094 1.056h-6.257c.018-.353.049-.7.095-1.055Z"></path>
</svg></a>
</li>
<li>
<a href="https://kuvo.com/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 64 16.054" width="64" height="16.054">
<title>KUVO</title>
<path fill="currentColor" d="M38.952 13.236a.226.226 0 0 0 .418-.008L43.592.393h2.763l-4.987 14.02a2.207 2.207 0 0 1-2.356 1.514 2.249 2.249 0 0 1-2.319-1.709L31.773.406h2.82ZM0 .399h2.532v15.422H0zm29.073 4.69a1.278 1.278 0 0 0-2.547.125v4.53a3.963 3.963 0 0 1-7.118 2.276 3.916 3.916 0 0 1-.7-2.381V.4h-2.58v9.232a7.721 7.721 0 0 0 .054.966 5.853 5.853 0 0 0 2.881 4.5 6.874 6.874 0 0 0 4.235.9 6.268 6.268 0 0 0 4-1.764 6.04 6.04 0 0 0 1.8-4.476Z"></path>
<circle cx="1.29" cy="1.29" r="1.29" fill="currentColor" transform="translate(26.503 .416)"></circle>
<path fill="currentColor" d="M61.186 2.351A8.04 8.04 0 0 0 51.962.818l1.1 2.34a5.447 5.447 0 1 1-2.944 5.643 1.29 1.29 0 1 0-2.548.4 8.028 8.028 0 1 0 13.618-6.849Z"></path>
<circle cx="1.301" cy="1.301" r="1.301" fill="currentColor" transform="translate(47.784 4.069)"></circle>
<path fill="currentColor" d="M6.745 8.298a.563.563 0 0 1 .01-.881l6.184-7.02H9.768L4.451 6.478a2.1 2.1 0 0 0 .035 3.13l5.366 6.229h3.316Z"></path>
</svg></a>
</li>
<li>
<a href="https://www.pioneerdj.com/en/landing/toraiz-brand/" class="footer-ext-nav__link"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 81 17.1" width="81" height="17.1">
<title>TORAIZ</title>
<path fill="currentColor" d="M64.596.312h4.199v16.443h-4.199zM19.886 0a8.529 8.529 0 1 1-.023 17.054 8.475 8.475 0 0 1-8.644-8.333 9.282 9.282 0 0 1 .645-3.51A8.546 8.546 0 0 1 19.886 0m.067 13.367c2.978 0 4.423-2.71 4.423-4.821s-1.445-4.858-4.467-4.858a4.578 4.578 0 0 0-4.489 4.8 4.611 4.611 0 0 0 4.533 4.879M55.055.312h-2.74L44.2 14.389l1.367 2.367h16.25l1.367-2.367Zm-5.517 12.754L53.7 5.85l4.171 7.216Zm-6.016-7.087A5.7 5.7 0 0 0 41.5 1.49C40.434.667 39.323.312 36.431.312h-6.158v16.443h4.2V4h2.3c1.614 0 2.711.733 2.711 2.221 0 .8-.288 2.353-2.75 2.356h-.578v2.574L39 16.755h4.522l-3.335-5.78a5.08 5.08 0 0 0 3.335-5M70.622 14l5.66-10h-5.66V.315h10.371v3.4l-5.239 9.357H81v3.687H70.629ZM3.245 4H0V.315h10.666V4H7.439v12.756H3.245Z"></path>
</svg></a>
</li>
<li>
<a href="https://www.pioneerproaudio.com/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 97 14.32" width="97" height="14.32">
<title>Pioneer PRO AUDIO</title>
<path fill="currentColor" d="M0 13.792c.084-.2.18-.389.252-.591.87-2.4 1.7-4.808 2.614-7.188a9.053 9.053 0 0 1 3.3-4.374A9.1 9.1 0 0 1 10.178.178a15.082 15.082 0 0 1 6.129.294 7.763 7.763 0 0 1 3.148 1.618 3.424 3.424 0 0 1 .685 4.593 6.2 6.2 0 0 1-3.74 2.689 13.043 13.043 0 0 1-4.748.361c-.87-.068-1.731-.22-2.6-.326-.2-.025-.281-.113-.323-.322-.188-.935-.4-1.865-.6-2.8-.014-.061-.02-.124-.035-.228.585.109 1.14.224 1.7.313a11.946 11.946 0 0 0 4.343.088 4.75 4.75 0 0 0 1.55-.606 1.066 1.066 0 0 0 .013-1.904 3.8 3.8 0 0 0-1.9-.676 9.148 9.148 0 0 0-3.655.25A4.468 4.468 0 0 0 7.125 6.5a715.58 715.58 0 0 0-2.516 7.121.381.381 0 0 1-.435.309c-1.391-.011-2.783 0-4.174 0Zm40.87.127a2.435 2.435 0 0 1 .06-.239c.5-1.391.99-2.784 1.5-4.169a5.282 5.282 0 0 1 3.154-3.2 11.487 11.487 0 0 1 6.864-.478 4.938 4.938 0 0 1 1.6.739A2.392 2.392 0 0 1 55 9.435c-.483 1.442-1.017 2.867-1.538 4.3a.308.308 0 0 1-.214.18c-1.3.011-2.607.008-3.953.008.047-.151.081-.274.124-.394l1.325-3.674a1.188 1.188 0 0 0-.86-1.742 2.8 2.8 0 0 0-3.458 1.74c-.455 1.266-.907 2.534-1.371 3.8-.04.108-.165.261-.253.262-1.3.016-2.607.011-3.932.011M97 5.916c-.024.1-.038.184-.065.262-.208.611-.426 1.219-.623 1.834a.3.3 0 0 1-.346.248c-.819-.011-1.639-.005-2.458-.005a1.61 1.61 0 0 0-1.83 1.276q-.733 2.021-1.419 4.059a.418.418 0 0 1-.484.336c-1.132-.014-2.264-.006-3.4-.006h-.353c.056-.17.1-.3.142-.435q.816-2.34 1.634-4.679a3.9 3.9 0 0 1 2.724-2.748 5.122 5.122 0 0 1 1.217-.158c1.671-.017 3.343-.007 5.014-.006.073 0 .145.012.246.021m-71.006-.021c-.05.164-.08.278-.119.388q-1.316 3.66-2.628 7.323c-.08.226-.173.325-.429.322-1.293-.016-2.587-.007-3.93-.007.034-.125.055-.225.089-.32q1.324-3.708 2.657-7.418a.37.37 0 0 1 .417-.294c1.294.012 2.587.006 3.943.006m43.944 5.239c-.282.79-.537 1.536-.819 2.27a.535.535 0 0 1-.327.254 17.815 17.815 0 0 1-5.954.63 11.4 11.4 0 0 1-4.183-.9 5.274 5.274 0 0 1-2.1-1.555 2.583 2.583 0 0 1-.25-3.037 5.028 5.028 0 0 1 2.1-2 10.413 10.413 0 0 1 3.919-1.152 12.053 12.053 0 0 1 6.032.77 8.414 8.414 0 0 1 1.56.919 2.693 2.693 0 0 1 .672.744 1.039 1.039 0 0 1-.194 1.45 4.448 4.448 0 0 1-1.161.692 12.109 12.109 0 0 1-3.41.7 12.538 12.538 0 0 1-5.094-.373c-.571-.18-1.113-.452-1.685-.689a1.227 1.227 0 0 0 .4 1.01 3.524 3.524 0 0 0 1.712.875 13.312 13.312 0 0 0 4.757.234 17.829 17.829 0 0 0 3.851-.823 1.255 1.255 0 0 1 .172-.025m-9.379-2.836c.26.1.438.173.623.228a11.429 11.429 0 0 0 3.645.417 9.466 9.466 0 0 0 1.471-.185c.148-.029.269-.208.4-.319a2.892 2.892 0 0 0-.367-.367.993.993 0 0 0-.392-.141c-.5-.087-1-.187-1.5-.233a8.307 8.307 0 0 0-3.882.6m24.961 2.838c-.286.8-.548 1.551-.835 2.3a.5.5 0 0 1-.308.232 17.9 17.9 0 0 1-5.956.63 11.634 11.634 0 0 1-4.035-.83 5.773 5.773 0 0 1-1.991-1.322 2.7 2.7 0 0 1-.324-3.645A5.454 5.454 0 0 1 74.5 6.54a12.086 12.086 0 0 1 5.6-.957 10.3 10.3 0 0 1 3.656.766A14.608 14.608 0 0 1 85.6 7.417a1.8 1.8 0 0 1 .429.444 1.183 1.183 0 0 1-.24 1.851 4.784 4.784 0 0 1-1.9.8 15.485 15.485 0 0 1-6.8.229 16.972 16.972 0 0 1-2.24-.82c-.066-.025-.129-.066-.228-.117a1.269 1.269 0 0 0 .394 1.056 3.5 3.5 0 0 0 1.709.881 13.273 13.273 0 0 0 4.758.237 17.6 17.6 0 0 0 3.852-.823 1.522 1.522 0 0 1 .183-.03m-9.386-2.832a5.078 5.078 0 0 0 .638.226c.653.133 1.306.288 1.966.359a8.7 8.7 0 0 0 3.022-.1 1.915 1.915 0 0 0 .527-.356c-.166-.139-.313-.356-.5-.4a12.066 12.066 0 0 0-1.742-.322 8.162 8.162 0 0 0-3.911.6m-43.108 6.02a11.072 11.072 0 0 1-4.886-1.056 5.07 5.07 0 0 1-1.822-1.445 2.624 2.624 0 0 1-.13-3.156 5.228 5.228 0 0 1 2.01-1.769 11.818 11.818 0 0 1 6.226-1.309A10.392 10.392 0 0 1 38.7 6.6a5.3 5.3 0 0 1 1.73 1.31 2.667 2.667 0 0 1 .123 3.5 6.227 6.227 0 0 1-2.726 1.99 12.464 12.464 0 0 1-4.8.921m.415-2.495c.262-.038.673-.068 1.069-.16a3.174 3.174 0 0 0 1.721-.914 1.234 1.234 0 0 0-.067-1.837 1.612 1.612 0 0 0-.565-.385 8.923 8.923 0 0 0-1.638-.43 4.33 4.33 0 0 0-2.6.491 2.825 2.825 0 0 0-.677.5 1.24 1.24 0 0 0 .09 1.947 4.121 4.121 0 0 0 2.661.791"></path>
</svg></a>
</li>
</ul>
<ul class="footer-ext-nav__list footer-ext-nav__list--ext">
<li class="footer-ext-nav__link footer-ext-nav__link--youtube">
<a href="https://www.youtube.com/user/pioneerdjglobal" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 18" width="24" height="18">
<title>YouTube</title>
<path fill="currentColor" d="M23.5 3.2c-.3-1-1.1-1.9-2.1-2.1C19.5.6 12 .6 12 .6s-7.5 0-9.4.5C1.6 1.4.8 2.2.5 3.2 0 5.1 0 9 0 9s0 3.9.5 5.8c.3 1 1.1 1.9 2.1 2.1 1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5c1-.3 1.8-1.1 2.1-2.1.5-1.9.5-5.8.5-5.8s0-3.9-.5-5.8Zm-14 9.4V5.5l6.3 3.6-6.3 3.6Z"></path>
</svg> <span class="screenReader">YouTube</span>
</a>
</li>
<li class="footer-ext-nav__link footer-ext-nav__link--instagram">
<a href="https://www.instagram.com/pioneerdjglobal/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20" width="20" height="20">
<title>Instagram</title>
<path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.296 0h1.408c2.082.003 2.452.016 3.42.06 1.063.049 1.79.218 2.426.465a4.902 4.902 0 0 1 1.772 1.154 4.903 4.903 0 0 1 1.153 1.77c.247.637.416 1.364.465 2.428.046 1.017.059 1.374.06 3.757v.733c-.001 2.382-.014 2.74-.06 3.756-.049 1.065-.218 1.792-.465 2.428a4.904 4.904 0 0 1-1.153 1.77 4.904 4.904 0 0 1-1.771 1.154c-.636.247-1.363.416-2.428.465-1.016.046-1.373.059-3.756.06h-.733c-2.383-.001-2.74-.014-3.757-.06-1.064-.049-1.791-.218-2.427-.465a4.903 4.903 0 0 1-1.771-1.153A4.902 4.902 0 0 1 .525 16.55C.278 15.915.11 15.188.06 14.122c-.044-.966-.057-1.337-.06-3.42V9.297c.003-2.082.016-2.452.06-3.419C.11 4.813.278 4.086.525 3.45A4.902 4.902 0 0 1 1.68 1.679 4.902 4.902 0 0 1 3.449.525C4.087.278 4.814.11 5.878.06 6.844.016 7.214.003 9.297 0Zm1.065 1.802H9.64c-2.341.001-2.676.012-3.68.058-.976.045-1.505.208-1.858.345-.466.181-.8.398-1.15.748-.35.35-.566.683-.747 1.15-.137.352-.3.881-.345 1.856-.046 1.005-.057 1.34-.058 3.68v.722c.001 2.34.012 2.675.058 3.68.045.975.208 1.505.345 1.857.181.467.398.8.748 1.15.35.35.683.566 1.15.748.352.137.881.3 1.856.344 1.022.047 1.35.058 3.798.058h.487c2.447 0 2.776-.011 3.797-.058.975-.044 1.505-.207 1.857-.344.467-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.352.3-.882.344-1.857.047-1.021.058-1.35.058-3.797v-.487c0-2.447-.011-2.776-.058-3.798-.044-.975-.207-1.504-.344-1.857a3.098 3.098 0 0 0-.748-1.15 3.098 3.098 0 0 0-1.15-.747c-.352-.137-.882-.3-1.857-.345-1.005-.046-1.34-.057-3.68-.058Zm-.236 2.948a5.125 5.125 0 1 1 0 10.25 5.125 5.125 0 0 1 0-10.25Zm0 1.798a3.327 3.327 0 1 0 0 6.654 3.327 3.327 0 0 0 0-6.654ZM15.25 3.5a1.25 1.25 0 1 1 0 2.5 1.25 1.25 0 0 1 0-2.5Z"></path>
</svg> <span class="screenReader">Instagram</span>
</a>
</li>
<li class="footer-ext-nav__link footer-ext-nav__link--facebook">
<a href="https://www.facebook.com/pioneer.dj.global" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20" width="20" height="20">
<title>Facebook</title>
<path fill="currentColor" d="M10 0C4.5 0 0 4.5 0 10s3.7 9.1 8.4 9.9v-7H5.9V10h2.5V7.8c0-2.5 1.5-3.9 3.8-3.9s2.2.2 2.2.2v2.5H12.7c-.9.2-1.2.8-1.2 1.5V10h2.8l-.4 2.9h-2.3v7C16.4 19.1 20 15 20 10S15.5 0 10 0Z"></path>
</svg> <span class="screenReader">Facebook</span>
</a>
</li>
<li class="footer-ext-nav__link footer-ext-nav__link--twitter">
<a href="https://twitter.com/PioneerDJglobal" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 18 18" width="18" height="18">
<title>X</title>
<path fill="currentColor" d="M10.477 7.618 17.03 0h-1.553l-5.69 6.614L5.242 0H0l6.873 10.002L0 17.991h1.553l6.01-6.985 4.799 6.985h5.242L10.476 7.618ZM8.35 10.09l-.697-.996-5.54-7.925h2.385l4.471 6.396.697.996 5.812 8.314h-2.385L8.35 10.09Z"></path>
</svg> <span class="screenReader">Twitter</span>
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="footer__legal">
<nav class="legalNav">
<ul class="legalNav__list" style="margin-top:20px !important">
<li class="legalNav__item">
<a href="https://alphatheta.com" class="text-bold" rel="noopener noreferrer" target="_blank">© AlphaTheta Corporation</a>
</li>
<li class="legalNav__item">
<a href="https://alphatheta.com/en/company/privacy-policy/" class="legalNav__link" rel="noopener noreferrer" target="_blank">Privacy policy</a>
</li>
<li class="legalNav__item">
<a href="https://alphatheta.com/en/company/terms-of-use/" class="legalNav__link" rel="noopener noreferrer" target="_blank">Terms of use</a>
</li>
<li class="legalNav__item">
<a href="/en/company/cookie-policy/" class="legalNav__link" rel="noopener noreferrer" target="_blank">Cookie Policy</a>
</li>
<li class="legalNav__item">
<a href="https://alphatheta.com/en/company/trademarks/" class="legalNav__link" rel="noopener noreferrer" target="_blank">Trademarks</a>
</li>
<li class="legalNav__item">
<button id="ot-sdk-btn" class="ot-sdk-show-settings legalNav__link">Cookie Settings</button>
</li>
</ul>
</nav>
</div>
</footer>
<script src="/Scripts/jquery-1.11.3.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/uCommerce/uCommerce.jQuery.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/uCommerce/uCommerce.ServiceStack.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/uCommerce/pdj.uc.custom.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/Custom/checkout.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/Custom/theSticker.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script>
let originUrl = window.location.origin;
let scriptElement = document.createElement('script');
scriptElement.src = `${originUrl}/scripts/main.js`;
document.write(scriptElement.outerHTML);
</script>
<script type="text/javascript">
// polyfill for startsWith method
if (!String.prototype.startsWith) {
String.prototype.startsWith = function(searchString, position) {
return this.substr(position || 0, searchString.length) === searchString;
};
}
function getQueryStringValueByName(name, url) {
if (!url) {
url = window.location.href;
}
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
//mark menu item as active
jQuery(".gigyaMenu ul li a").bind('click', function() {
jQuery(".gigyaMenu ul li a").removeClass("active");
jQuery(this).addClass("active");
});
var jwtToken;
function sendZendeskToken(data) {
jQuery.ajax({
type: "POST",
url: "/ForumConnector/zenssologin.aspx",
async: false,
data: data.user,
dataType: "jsonp",
complete: function(res) {
jwtToken = JSON.parse(res.responseText);
}
});
}
function onLogout(response) {
function loaded() {
jQuery.ajax({
url: "/en/" + "api/Account/Logout",
async: false,
cache: false,
success: function(data) {
if (data.Success) {
var logoutContainer = jQuery("#LogoutContainer");
var loginRegister = jQuery("#LoginRegister");
if (logoutContainer != undefined) {
logoutContainer.hide();
}
if (loginRegister != undefined) {
loginRegister.show();
}
location.reload();
}
},
error: function() {
alert("Error during logout!"); //TODO: other way to inform about the error
}
});
}
if (response.errorCode == 0) {
var iframe = document.createElement("iframe");
iframe.setAttribute("src", "https://pioneerdj-community.zendesk.com" + "/access/logout/");
iframe.style.width = 0;
iframe.style.height = 0;
if (iframe.addEventListener) {
iframe.addEventListener("load", loaded, false);
} else {
iframe.attachEvent("onload", loaded);
}
document.body.appendChild(iframe);
setTimeout(loaded, 850); //neccessary for firefox - in case iframe throws an error, firefox won't fire onload event
}
}
function onLoginSocialize(response) {
sendZendeskToken(response);
}
function loginToZendesk() {
function loaded() {
gigya.setSSOToken({
redirectURL: typeof(returnTo) === 'undefined' ? window.location.href : returnTo
});
window.location.reload();
}
var iframe = document.createElement("iframe");
iframe.setAttribute("src", "https://pioneerdj.zendesk.com" + "/access/jwt" + "?jwt=" + jwtToken.token);
iframe.style.width = 0;
iframe.style.height = 0;
document.body.appendChild(iframe);
iframe.onload = loaded;
iframe.onerror = loaded;
}
function onLogin(response) {
if (response != undefined && response.UID != undefined) {
// 206005 - autologin finalization triggered with email verification link
if (getQueryStringValueByName('errorCode') == '206005') {
gigya.accounts.getAccountInfo({
callback: onEmailVerified,
include: 'emails,data'
});
}
var queue = function() {
typeof jwtToken !== "undefined" ?
loginToZendesk() :
setTimeout(function() {
queue();
}, 100);
};
queue();
}
}
function onEmailVerified(response) {
if (response != undefined && response.errorCode == 0) {
var verifiedEmails = response.emails.verified;
if (verifiedEmails.length > 1) {
// deactivate all account emails except for the new one that just got verified
var previousEmails = verifiedEmails.slice(0, verifiedEmails.length - 1).join(", ");
var storedEmails = response.data.previousEmailAddresses;
if (storedEmails != undefined) {
storedEmails = storedEmails + ", " + previousEmails;
} else {
storedEmails = previousEmails;
}
gigya.accounts.setAccountInfo({
removeLoginEmails: previousEmails,
data: {
previousEmailAddresses: storedEmails
}
});
}
}
}
function onProfileUpdate(response) {
if (response.response.errorCode === 0) {
if (response != undefined && response.profile != undefined) {
if (response.profile.photoURL != undefined) {
jQuery(".visual-wrap .in").css("background-image", "url('" + response.profile.photoURL + "')");
}
jQuery(".item-profile a .content-wrap .name").text(response.profile.firstName);
jQuery(".profile-box .content-wrap").html(response.profile.firstName + '<br/>');
}
showMessage("Your changes have been saved.");
}
}
function onPasswordChange(response) {
if (response.response.errorCode === 0) {
selectMenuItem();
showMessage("Your password has been changed.");
navigateEditMyProfile();
}
}
function onProfileFieldChange(response) {
if (response != undefined) {
jQuery('input[name="profile.email"]').bind('change', function() {
showMessage("Click ‘Save changes’ to change your email address. You’ll receive an email to verify your new email address.");
});
}
}
function selectMenuItem() {
jQuery(".errorSection").hide();
jQuery(".gigyaMenu ul li a").removeClass("active");
jQuery(".gigyaMenu ul li a").first().addClass("active");
}
function showMessage(message) {
jQuery(".errorSection").html("").hide();
document.getElementById("messageSection").style.display = "block";
document.getElementById("messageSection").innerHTML = message;
window.scrollTo(0, 0);
}
function showLicenses() {
showLoadingScreen();
redirectIfLoggedOut();
gigya.socialize.getUserInfo({
callback: generateUserLicences
});
}
function generateUserLicences(response) {
var gigyaPageTarget = jQuery("#gigya-page-target");
if (response.errorCode == 0) {
var user = response['user'];
var uid = user['UID'];
jQuery.get('/api/sitecore/PioneerDjAccount/GetLicences', {
userId: uid
}, function(data) {
hideLoadingScreen();
if (isLicencesScreenDisplayed() === true) {
gigyaPageTarget.html(data);
var cell = jQuery(".licences-container .licence .item .key");
if (typeof cell !== 'undefined') {
cell.matchHeight();
}
}
});
} else {
gigyaPageTarget.html('No licences could be found.');
}
}
function isLicencesScreenDisplayed() {
return jQuery("#license_btn").hasClass("active");
}
function navigateChangePassword() {
parent.location.hash = 'password';
gigya.accounts.showScreenSet({
screenSet: 'pioneerdj.com-ProfileUpdate',
containerID: 'gigya-page-target',
startScreen: 'gigya-change-password-screen',
lang: 'en',
onAfterSubmit: changePasswordHandler,
onBeforeScreenLoad: redirectIfLoggedOut,
onError: errorEventHandler
});
}
function navigateEditMyProfile() {
parent.location.hash = 'editprofile';
gigya.accounts.showScreenSet({
screenSet: 'pioneerdj.com-ProfileUpdate',
lang: 'en',
containerID: 'gigya-page-target',
onError: errorEventHandler,
onAfterSubmit: updateProfileHandler,
onBeforeScreenLoad: redirectIfLoggedOut,
onAfterScreenLoad: changeProfileFieldHandler
});
}
function redirectIfLoggedOut() {
gigya.accounts.getAccountInfo({
callback: function(response) {
if (response.errorCode != 0) {
window.location.href = '/';
}
}
});
}
function createOneNewsletterOption(response) {
if (response != undefined) {
var pdjCheckbox = jQuery("[name='data.PDJ_newsletter'][data-screenset-roles='instance']");
var kuvoCheckbox = jQuery("[name='data.KUVO_newsletter'][data-screenset-roles='instance']");
var mainCheckbox = '<div class="gigya-composite-control gigya-composite-control-checkbox"' +
' style="display: block; margin-top:15px;"><input id="maincheckbox" type="checkbox">' +
'<label class="gigya-label" for="maincheckbox"><span class="gigya-label-text gigya-checkbox-text">' +
"Please keep me informed about Pioneer DJ products, services, features, including newsletters, promotions, events, tips and surveys." +
'</span></label></div>';
kuvoCheckbox.parent().after(mainCheckbox);
jQuery("#registerContainer").on('change', '#maincheckbox', function() {
pdjCheckbox.prop("checked", this.checked);
kuvoCheckbox.prop("checked", this.checked);
});
pdjCheckbox.parent().hide();
kuvoCheckbox.parent().hide();
}
}
// My Products functions
function handleMyProductsError(data) {
if (typeof data.responseJSON != 'undefined') {
errorEventHandler({
errorMessage: data.responseJSON.error,
response: {
info: {
screen: "gigya-my-products-screen"
}
}
});
} else {
errorEventHandler({
errorMessage: getErrorMessage(data),
response: {
info: {
screen: "gigya-my-products-screen"
}
}
});
}
}
function getErrorMessage(data) {
if (data.status == 401 || data.status == 403) {
return "Unauthorized user";
}
return "Unexpected error occurred";
}
function getAuthHeaders(response) {
var authHeaders = {
"PDJ-UID": response.user.UID,
"PDJ-Timestamp": response.user.signatureTimestamp,
"PDJ-UIDSignature": response.user.UIDSignature
}
return authHeaders;
}
function navigateMyProducts(msg) {
showLoadingScreen();
redirectIfLoggedOut();
gigya.socialize.getUserInfo({
callback: getMyProducts,
context: msg
});
}
function isMyProductsScreenDisplayed() {
return jQuery("#my-products-tab").hasClass("active");
}
function getMyProducts(response) {
var gigyaPageTarget = jQuery("#gigya-page-target");
if (response.errorCode == 0) {
jQuery.ajax({
type: 'GET',
url: '/api/sitecore/ProductRegistration/Get',
headers: getAuthHeaders(response),
cache: false,
success: function(data) {
if (isMyProductsScreenDisplayed() === true) {
gigyaPageTarget.html(data);
jQuery('a.btn-link[href="#"]').each(function(i, o) {
jQuery(o).addClass('hidden');
});
initCompleter();
}
if (response.context) {
var msg = response.context;
jQuery('#validation-success')
.removeClass('hidden');
jQuery('#validation-success')
.html(msg);
}
window.scrollTo(0, 0);
var $purchaseDateInput = jQuery("#input-purchase-date");
$purchaseDateInput.attr('readonly', 'readonly');
$purchaseDateInput.datepicker({
changeMonth: true,
changeYear: true,
constrainInput: true,
dateFormat: "dd/mm/yy",
maxDate: "26/11/2024"
});
},
error: function(data) {
errorEventHandler({
errorMessage: data.responseJSON.error
});
},
complete: function() {
hideLoadingScreen();
}
});
}
}
function showLoadingScreen() {
jQuery("#gigya-page-target").children().hide();
jQuery("#loading-message").show();
}
function hideLoadingScreen() {
jQuery("#gigya-page-target").children().show();
jQuery("#loading-message").hide();
}
</script>
<script src="/Scripts/Custom/ui_fixes.js"></script>
<!-- /#wrapper -->
</body>
</html>
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en">
<!--<![endif]-->
<head>
<base href="https://preprod.pioneerdj.com">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0" />
<title>DDJ-FLX10 SPLIT. MIX. CREATE.</title>
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@PioneerDJglobal" />
<meta name="twitter:creator" content="@PioneerDJglobal" />
<meta name="description" content="The DDJ-FLX10 is a 4-channel performance DJ controller for rekordbox and Serato DJ Pro. It includes a host of brand-new features including Track Separation technology, which enables new creative possibilities such as the easy performance of mash-ups on the fly with no need to prepare tracks in advance.
">
<meta property="og:title" content="DDJ-FLX10 SPLIT. MIX. CREATE." />
<meta property="og:site_name" content="Pioneer DJ" />
<meta property="og:url" content="https://preprod.pioneerdj.com/en/product/controller/ddj-flx10/black/overview/" />
<meta property="og:type" content="website" />
<meta property="og:description" content="The DDJ-FLX10 is a 4-channel performance DJ controller for rekordbox and Serato DJ Pro. It includes a host of brand-new features including Track Separation technology, which enables new creative possibilities such as the easy performance of mash-ups on the fly with no need to prepare tracks in advance.
" />
<meta property="og:image" content="https://www.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png" />
<meta property="og:image:width" content="600" />
<meta property="og:image:height" content="315" />
<link rel="canonical" href="https://preprod.pioneerdj.com/en/product/controller/ddj-flx10/black/overview/" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-title" content="Pioneer DJ">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link href="https://plus.google.com/u/0/+pioneerdjglobal" rel="publisher" />
<link href="/Content/img/app/apple-touch-icon-precomposed-152.png" sizes="152x152" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-144.png" sizes="144x144" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-76.png" sizes="76x76" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-72.png" sizes="72x72" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-120.png" sizes="120x120" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-114.png" sizes="114x114" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-icon-precomposed-57.png" sizes="57x57" rel="apple-touch-icon-precomposed">
<link href="/Content/img/app/apple-touch-startup-image-1536x2008.jpg" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-1496x2048.jpg" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-768x1004.jpg" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 1) and (orientation: portrait)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-748x1024.jpg" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 1) and (orientation: landscape)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-1242x2148.jpg" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-1182x2208.jpg" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-750x1294.jpg" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-640x1096.jpg" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-640x920.jpg" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
<link href="/Content/img/app/apple-touch-startup-image-320x460.jpg" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">
<link href="/Content/css/fonts-default.css" rel="stylesheet" type="text/css">
<link href="https://preprod.pioneerdj.com/-/media/feature/experience-accelerator/bootstrap/bootstrap/styles/bootstrap.css" rel="stylesheet" />
{{!-- <link href="https://preprod.pioneerdj.com/-/media/themes/pioneer/pioneerdj/productredesign-theme/styles/main.css" rel="stylesheet" /> --}}
<script type="text/javascript">
function checkForSpecialCharacters(formData, toCheck) {
var errors = {};
toCheck.forEach(function (item) {
if (formData != null && !formData[item].match(new RegExp('^((?![\<,\>,\&,\"]).)*$'))) {
errors[item] = 'This character can not be used.';
}
});
return errors;
}
window.__gigyaConf = {
validation: {
'gigya-register-screen': function(formData, eventType, callback) {
return checkForSpecialCharacters(formData, ['profile.firstName', 'profile.lastName']);
},
'gigya-update-profile-screen': function(formData, eventType, callback) {
var errors = checkForSpecialCharacters(formData, ['profile.nickname', 'profile.firstName', 'profile.lastName', 'profile.city', 'profile.zip']);
if (formData != null && formData['profile.nickname'].length == 0 && !enableEmptyNickname)
errors['profile.nickname'] = "You can not leave this field blank.";
return errors;
}
},
enableSSOToken: true,
bypassCookiePolicy: 'always'
};
</script>
<script type="text/javascript" src="https://cdns.gigya.com/JS/socialize.js?apikey=3_wlzhvsGzBbA5N0X2o1INKsrMGr2b46ppQ-dIKrzCgfT3SnaX6_0071zXz_9KKNOw&lang=en">{ enabledProviders:'facebook,twitter,linkedin,yahoo' }</script><link href="/content/css/gigya/gigya.css?bundleVirtualPath=%7e%2fBundles%2fGigyaStyle%2f" rel="stylesheet"/>
<link href="/Content/css/licences.css?bundleVirtualPath=%7e%2fBundles%2fGigyaStyle%2f" rel="stylesheet"/>
<link href="/Content/css/ATCare/atc.css?bundleVirtualPath=%7e%2fBundles%2fGigyaStyle%2f" rel="stylesheet"/>
<link href="/Content/css/plugins/jquery-ui-1.9.2.custom.min.css?bundleVirtualPath=%7e%2fBundles%2fGigyaStyle%2f" rel="stylesheet"/>
<script type="text/javascript" src="//cdn.gigya-ext.com/screenset-validation.min.js"></script>
<script src="/GigyaConnector/Scripts/gigyaconnector_mvc.js?bundleVirtualPath=%7e%2fBundles%2fGigyaConnector%2f"></script>
<script>
(function() {
['main', 'reskin-theme-2020', 'reskin-theme-2022'].forEach(name => {
const link = document.createElement('link');
link.rel = 'stylesheet';
link.href = name.includes('http') ? name : `${window.location.origin}/styles/${name}.css`;
document.head.appendChild(link);
});
}());
</script>
</head>
<body class="header__experience-mode" class="default-device bodyclass">
<!--
<div class="cookies">
<div class="cookies__content">Cookies help us improve your website experience. By using our website, you agree to our use of cookies. <a href="/en/company/cookie-policy/" class="cookies__policy">More information</a></div>
<a href="#" class="cookies__close cookies__trigger"><span class="cookies__icon"><svg class="symbol symbol--close" viewBox="0 0 12 14" version="1" xmlns="http://www.w3.org/2000/svg"><path d="M6.066 5.492L2.372.931A1 1 0 1 0 .818 2.19l3.848 4.752L.418 11.34a1 1 0 0 0 1.439 1.39v-.001l4.077-4.222 3.694 4.561a1 1 0 1 0 1.554-1.259L7.334 7.059l4.248-4.399a1 1 0 0 0-1.439-1.39v.001L6.066 5.492z" fill="currentColor" fill-rule="evenodd"/></svg></span></a>
</div>
-->
<script>
dataLayer = [];
</script>
<!-- Google Tag Manager -->
<noscript>
<iframe src="//www.googletagmanager.com/ns.html?id=GTM-PSC5SC"
height="0" width="0" style="display:none;visibility:hidden"></iframe>
</noscript>
<script>
(function (w, d, s, l, i) {
w[l] = w[l] || []; w[l].push({
'gtm.start':
new Date().getTime(), event: 'gtm.js'
}); var f = d.getElementsByTagName(s)[0],
j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src =
'//www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'dataLayer', 'GTM-PSC5SC');</script>
<!-- End Google Tag Manager -->
<!-- #wrapper -->
<head>
<style>
</style>
</head>
<div class="brand-bar">
<div class="brand-bar__inner">
<a href="https://alphatheta.com" target="_blank" class="brand-bar__logo">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 117 18.7" width="117" height="18.7">
<title>AlphaTheta</title>
<path fill="currentColor" d="m32.28 2.62 4.89 12.69h-2.38l-1.19-3.36h-5.06l-1.19 3.36h-2.29l4.87-12.69h2.36ZM31.05 4.8l-1.92 5.45H33L31.1 4.8h-.05Zm9.47-2.18v12.69h-2.03V2.62h2.03Zm11.18 8.14c0 2.42-1.21 4.8-3.96 4.8-1.15 0-2.45-.41-3.07-1.44h-.04v4.58H42.6V6.12h1.92v1.24h.04c.59-1.07 1.67-1.49 2.84-1.49 2.88 0 4.3 2.2 4.3 4.89Zm-4.57 3.19c1.83 0 2.54-1.63 2.54-3.23s-.76-3.25-2.56-3.25c-1.88 0-2.56 1.6-2.56 3.25s.78 3.23 2.58 3.23Zm7.95-11.33v4.71h.04c.59-.92 1.62-1.46 2.77-1.46 2.11 0 3.23 1.23 3.23 3.06v6.38h-2.03V9.62c0-1.17-.36-2.15-1.79-2.15s-2.22 1.16-2.22 2.36v5.47h-2.03V2.62h2.03Zm15.69 5.86v4.83c0 .48.11.64.55.64.11 0 .28 0 .43-.04v1.4c-.52.14-1.05.23-1.28.23-.89 0-1.42-.36-1.56-1.12-.73.73-2.06 1.12-3.18 1.12-1.81 0-3.15-1-3.15-2.68s1.01-2.4 2.38-2.68c.69-.14 1.46-.23 2.31-.34 1.23-.14 1.6-.43 1.6-1.14 0-.8-.64-1.24-1.9-1.24s-1.94.53-2.03 1.46h-2.03c.14-2.01 1.6-3.06 4.18-3.06 2.22 0 3.68 1.05 3.68 2.61Zm-4.43 5.47c1.39 0 2.4-.69 2.4-1.69V10.7c-.55.34-.82.34-2.22.52-1.33.16-1.92.64-1.92 1.47 0 .76.64 1.26 1.74 1.26ZM81.41 2.62v1.92h-4.03v10.77h-2.22V4.54h-4.02V2.62h10.27Zm3.04 0v4.71h.04c.59-.92 1.62-1.46 2.77-1.46 2.11 0 3.23 1.23 3.23 3.06v6.38h-2.03V9.62c0-1.17-.36-2.15-1.79-2.15s-2.22 1.16-2.22 2.36v5.47h-2.03V2.62h2.03Zm16.19 7.92c0 .23-.02.46-.04.69h-6.75c0 1.51.87 2.72 2.47 2.72 1.12 0 1.87-.46 2.24-1.53h1.92c-.41 1.97-2.15 3.13-4.16 3.13-2.9 0-4.5-2.03-4.5-4.82s1.71-4.87 4.44-4.87c2.59 0 4.37 2.13 4.37 4.67Zm-2.07-.64c-.11-1.28-.94-2.43-2.33-2.43s-2.33 1.08-2.4 2.43h4.73Zm6.21-6.54v2.75h1.83v1.51h-1.83v5.01c0 .96.23 1.16 1.01 1.16.37 0 .75-.04.82-.07v1.56c-.8.09-1.03.11-1.31.11-1.94 0-2.54-.62-2.54-2.47V7.63h-1.53V6.12h1.53V3.37h2.03Zm11.24 5.12v4.83c0 .48.11.64.55.64.11 0 .28 0 .43-.04v1.4c-.52.14-1.05.23-1.28.23-.89 0-1.42-.36-1.56-1.12-.73.73-2.06 1.12-3.18 1.12-1.81 0-3.14-1-3.14-2.68s1.01-2.4 2.38-2.68c.69-.14 1.46-.23 2.31-.34 1.23-.14 1.6-.43 1.6-1.14 0-.8-.64-1.24-1.9-1.24s-1.94.53-2.03 1.46h-2.03c.14-2.01 1.6-3.06 4.18-3.06 2.22 0 3.68 1.05 3.68 2.61Zm-4.42 5.47c1.39 0 2.4-.69 2.4-1.69V10.7c-.55.34-.82.34-2.22.52-1.33.16-1.92.64-1.92 1.47 0 .76.64 1.26 1.74 1.26ZM18.46 1.35C15.26-1.26 10.62.22 7.85 3.19c-.37.4-.71.84-1.03 1.3 1.61-2.12 4.01-3.46 6.35-3.28 3.44.26 5.42 3.69 4.44 7.66-.98 3.97-4.56 6.98-8 6.72-3.08-.23-4.99-3-4.65-6.43 1.03-.57 2.18-.78 3.21-.51 2.02.54 2.86 2.75 1.95 5 .29-.64.49-1.31.55-1.96.03-.29.03-.58 0-.88-.18-2.24-1.97-4.18-4.93-3.68-4.78.81-7.31 6.14-4.68 9.28 1.61 1.91 4.48 1.63 6.52.27 1.58 1.12 3.75 1.51 6.26.58 7.28-2.69 9.66-11.77 4.61-15.9ZM4.31 17.12c-2.09-.56-2.92-2.91-1.85-5.25.53-1.16 1.43-2.1 2.45-2.68-.14.81-.18 1.62-.11 2.39l.06.53c.04.29.11.57.18.85.41 1.48 1.26 2.79 2.46 3.66-1.02.56-2.17.77-3.2.5Z" />
</svg>
</a>
</div>
</div>
<header class="header theme-2020">
<div class="header__inner">
<div class="header__in">
<div class="header__content">
<a class="header__trigger">
<span class="menuIcon">
<span class="menuIcon__inner">
<span class="menuIcon__bar"></span>
</span>
</span>
</a>
<a href="/en" class="header__logo">
<svg class="logo" viewBox="0 0 162 24">
<path fill="currentColor" d="M0.473684,17.4307148 C0.579569432,17.1848501 0.698235535,16.9437641 0.789479818,16.6922965 C1.87583685,13.6974261 2.91592461,10.6841817 4.05534569,7.71048668 C4.90242914,5.49976344 6.20630025,3.59941977 8.17961966,2.24650428 C9.69857813,1.20512189 11.3954144,0.661813437 13.190856,0.420397944 C15.7630065,0.0745887887 18.3244794,0.0844761127 20.8489855,0.788618366 C22.2919879,1.19119724 23.6403487,1.79498315 24.7815494,2.80909301 C26.5363032,4.368324 26.8715935,6.53200006 25.6374499,8.54851977 C24.5467248,10.3306275 22.8971284,11.3381458 20.9601288,11.9074085 C19.015121,12.4789782 17.0231968,12.5165501 15.0270663,12.3595064 C13.9411946,12.2740634 12.8634929,12.0838148 11.7807759,11.9516543 C11.5280745,11.9208388 11.4294692,11.8103479 11.3770523,11.548993 C11.1423895,10.3808881 10.8774737,9.21904513 10.6246105,8.05473034 C10.608028,7.97818597 10.6009906,7.89949935 10.5819004,7.77022259 C11.3133916,7.90600851 12.0066217,8.05028104 12.7049478,8.16118386 C14.5081549,8.44775146 16.3230102,8.64722823 18.1302618,8.27043879 C18.8015705,8.13053315 19.489381,7.88021907 20.0679085,7.51364654 C21.0733752,6.87665569 21.0450636,5.84878597 20.0862706,5.13137823 C19.3807452,4.60339513 18.5590614,4.38200146 17.7106028,4.286424 C16.1727968,4.11314865 14.6387119,4.15690006 13.142888,4.59869865 C11.2513488,5.15741485 10.0399353,6.4699571 9.37493595,8.31509654 C8.30863972,11.2737958 7.2682284,14.2421353 6.23307494,17.2122874 C6.12848376,17.5123677 5.99339692,17.5997881 5.6893302,17.5973986 C3.95091628,17.5836388 2.2122597,17.5936085 0.473684,17.5955036 L0.473684,17.4307148 Z M144.134896,23.4455036 C144.263188,23.0177944 144.379913,22.5860479 144.523008,22.1635296 C144.658418,21.7637522 144.719491,21.2336268 145.002041,21.0203902 C145.264691,20.822067 145.776646,20.9725191 146.178429,20.9582648 C147.407072,20.9147606 148.621235,20.783012 149.778938,20.3209444 C151.098501,19.7942796 152.044352,18.9259254 152.517803,17.5087423 C153.219122,15.4094163 154.00028,13.3378571 154.747221,11.2543508 C154.788718,11.1385867 154.837171,11.0243881 154.867343,10.905493 C155.070621,10.1037958 154.81614,9.76655569 154.011038,9.76556696 C153.611198,9.76507259 153.211357,9.76548456 152.752304,9.76548456 C153.010749,9.0468409 153.237889,8.37680992 153.502319,7.72243386 C153.540257,7.62858668 153.758013,7.56423668 153.892858,7.56374231 C156.343754,7.55443175 158.794649,7.55715076 161.245545,7.55640921 C161.339135,7.55640921 161.432725,7.54792259 161.526316,7.5433909 L161.526316,7.62578527 C161.471067,7.74772893 161.406841,7.86637682 161.361785,7.99202823 C160.098601,11.5162001 158.843345,15.0432557 157.573529,18.5648733 C156.854171,20.5600529 155.527813,21.9629817 153.539771,22.6505627 C152.830929,22.8957684 152.089489,23.0665719 151.349828,23.1899163 C150.543594,23.3243839 149.722234,23.3643451 148.907425,23.4455036 L144.134896,23.4455036 Z M51.5382237,17.5893652 C51.5674251,17.4705525 51.5818236,17.3771173 51.6131281,17.2899441 C52.2370352,15.5529884 52.8507501,13.8120779 53.4914014,12.081549 C54.2081706,10.1456934 55.556046,8.80966872 57.4318926,8.08097294 C60.2206673,6.99756942 63.1014953,6.81382999 66.0073992,7.48377858 C66.7103361,7.6458483 67.4068827,7.99709548 68.0115378,8.40651308 C69.2295034,9.2311159 69.6623475,10.5760391 69.1913232,11.9860539 C68.5892565,13.7884307 67.9219113,15.5683138 67.2713105,17.3536349 C67.2353952,17.452261 67.0962638,17.5784891 67.0042106,17.5793131 C65.3751604,17.5929905 63.7459485,17.5892004 62.0644813,17.5892004 C62.1238548,17.3997758 62.1659178,17.2462751 62.219629,17.0970589 C62.7707347,15.5664187 63.3249143,14.0369321 63.8756965,12.5061272 C64.2703604,11.409211 63.9089425,10.680268 62.8011495,10.3293504 C61.0318355,9.76882154 59.1163526,10.732506 58.4799076,12.5035729 C57.9112486,14.0860391 57.3471195,15.670318 56.7666506,17.2482525 C56.7170648,17.3830497 56.5604611,17.5734631 56.4515828,17.5748638 C54.8226134,17.5958744 53.1933206,17.5893652 51.5382237,17.5893652 Z M121.667909,7.59000963 C121.637251,7.71533146 121.61986,7.81923076 121.586371,7.91752724 C121.326471,8.68115823 121.053789,9.44042231 120.807074,10.2084202 C120.730632,10.4464575 120.616901,10.5212716 120.374715,10.5180582 C119.350886,10.5044632 118.326896,10.5121258 117.302986,10.512373 C116.011572,10.512785 115.466128,10.8716125 115.017268,12.1065392 C114.405737,13.789197 113.815481,15.4802589 113.244395,17.1775005 C113.130016,17.5174596 112.968963,17.6011723 112.640468,17.5972174 C111.2261,17.5799146 109.811329,17.5898019 108.396638,17.5898019 L107.956675,17.5898019 C108.025756,17.3778012 108.076798,17.2111174 108.134149,17.0467406 C108.813708,15.0977019 109.491488,13.1479216 110.175416,11.200366 C110.771173,9.50403076 111.793061,8.22922513 113.578391,7.76765189 C114.069314,7.64076456 114.588145,7.57666175 115.095085,7.5714709 C117.183106,7.54996597 119.271533,7.56191315 121.359797,7.56306668 C121.450556,7.56314907 121.541315,7.57847442 121.667909,7.59000963 Z M32.9509623,7.56188844 C32.8881106,7.76762717 32.8512246,7.90951027 32.8018815,8.04677928 C31.7063029,11.0962772 30.605871,14.1440448 29.5185433,17.1965913 C29.4179966,17.478792 29.3016763,17.6023835 28.9828876,17.5985934 C27.3666989,17.5794779 25.7501867,17.5897772 24.0724406,17.5897772 C24.1150698,17.4335575 24.1403075,17.30873 24.182775,17.1902469 C25.2903253,14.1014469 26.4032143,11.014542 27.5025947,7.92261097 C27.6017662,7.64370604 27.7342646,7.5521659 28.0243373,7.55480252 C29.6403641,7.56955111 31.2566336,7.56188844 32.9509623,7.56188844 Z M87.8546861,14.107989 C87.5032177,15.0957327 87.1847525,16.0267066 86.8319898,16.9439207 C86.7777124,17.0849798 86.5805827,17.2158221 86.4240599,17.2622101 C83.9920924,17.9836552 81.5022074,18.1658291 78.9844152,18.048582 C77.1835539,17.9647869 75.4219245,17.6726989 73.7579297,16.9281834 C72.7478522,16.4761679 71.8323356,15.8824341 71.1391055,14.9849122 C70.2171985,13.7912651 70.0986942,12.5294777 70.8271115,11.1906517 C71.4368628,10.0698411 72.3577991,9.2905552 73.4447224,8.69434956 C74.9737112,7.85565731 76.6277565,7.44459182 78.3405282,7.25557914 C80.92643,6.97032985 83.4573264,7.21421717 85.8778884,8.21728618 C86.5673976,8.50302985 87.2089387,8.93304604 87.8263745,9.36520449 C88.1598044,9.59862773 88.4403321,9.94649675 88.666097,10.2954369 C89.0783949,10.9325925 89.0028434,11.6278362 88.4240731,12.1070418 C87.9935748,12.4634798 87.4896281,12.7607587 86.9738714,12.9710291 C85.6115975,13.5262848 84.1614767,13.702032 82.7132164,13.8467989 C80.5668726,14.0613538 78.4290222,14.0390249 76.3476334,13.3813531 C75.6353132,13.1562517 74.9579376,12.8162101 74.2425436,12.5195904 C74.1901267,13.0226904 74.4040816,13.4319432 74.7463285,13.7818721 C75.3382839,14.3871411 76.0976014,14.6709073 76.8853922,14.8757397 C78.8454456,15.3855136 80.8345386,15.3721658 82.8287277,15.1679101 C84.4676466,14.9999904 86.0738048,14.6629151 87.6405695,14.139546 C87.6882947,14.1236439 87.7413588,14.1240559 87.8546861,14.107989 Z M76.1337593,10.5573686 C76.4599091,10.6776644 76.6821148,10.7740658 76.9123287,10.8420411 C78.4008724,11.2816975 79.9273537,11.413858 81.4675054,11.3630207 C82.0825954,11.3427517 82.699465,11.2488221 83.30501,11.1317397 C83.4903297,11.0959805 83.640543,10.8717855 83.8068535,10.7338573 C83.6559122,10.5780496 83.5222005,10.396782 83.348529,10.2745911 C83.2103683,10.1773658 83.0272326,10.1290003 82.857282,10.0993383 C82.2347501,9.99066013 81.61238,9.86484393 80.9845093,9.80741506 C79.349635,9.65795168 77.7675821,9.91395097 76.1337593,10.5573686 Z M107.321719,14.1033008 C106.96386,15.0987895 106.636254,16.0414634 106.277829,16.9717782 C106.227758,17.1017141 106.040173,17.2183022 105.8936,17.261724 C103.460824,17.9814388 100.970696,18.1655902 98.4523376,18.0493317 C96.7199904,17.9693268 95.0233159,17.6933057 93.4100393,17.0115747 C92.4814993,16.6191303 91.6282682,16.1042479 90.9228237,15.360062 C89.6065764,13.9714698 89.463077,12.4106733 90.5182912,10.8057958 C91.2712992,9.66059654 92.3422871,8.91245569 93.5579068,8.36906485 C95.786597,7.37266977 98.1353284,7.05981837 100.547154,7.17368738 C102.116669,7.24775992 103.665638,7.50178175 105.114303,8.13094513 C105.922316,8.48186273 106.664404,8.99592118 107.418949,9.46532189 C107.630154,9.5967409 107.797354,9.81665146 107.954686,10.0201655 C108.61103,10.8696515 108.505953,11.6807416 107.653126,12.3323986 C106.949138,12.8704339 106.129395,13.1476909 105.284496,13.3372803 C102.471131,13.9685036 99.6333363,14.2521874 96.789637,13.623024 C95.8297115,13.4106113 94.9228501,12.9491205 93.9926114,12.598862 C93.9083237,12.5671402 93.8309117,12.5166325 93.7080393,12.4529416 C93.6564313,13.0130585 93.8618927,13.4231353 94.199448,13.7720754 C94.7884913,14.3809698 95.5478897,14.6668782 96.3356805,14.8727817 C98.2954912,15.3849451 100.285312,15.3733275 102.279825,15.1693191 C103.918744,15.0017289 105.526115,14.6686909 107.092314,14.1412022 C107.141495,14.1246409 107.195692,14.1234874 107.321719,14.1033008 Z M95.5932691,10.5591895 C95.9362441,10.6836874 96.156832,10.7954141 96.3899579,10.8426261 C97.2063839,11.0079916 98.0217584,11.2026071 98.8474059,11.2906043 C100.106464,11.4247423 101.376765,11.4752501 102.622395,11.1677543 C102.862963,11.1083479 103.06252,10.8760782 103.281004,10.7235663 C103.074411,10.5492198 102.891518,10.2781423 102.656774,10.2184888 C101.942512,10.0368092 101.212882,9.88973527 100.480743,9.81450921 C98.8343017,9.64518879 97.2397916,9.91000428 95.5932691,10.5591895 Z M41.7343085,18.0901499 C39.6459631,18.0575217 37.5680525,17.7452471 35.6290306,16.7702746 C34.7506426,16.3285584 33.9591308,15.7658048 33.353424,14.9648492 C32.4224573,13.733795 32.3618705,12.3265816 33.1906727,11.0221964 C33.8160358,10.0380781 34.7030791,9.35024992 35.7022363,8.81180273 C38.1368732,7.49967245 40.7573152,7.06413583 43.4805688,7.17586259 C45.3403182,7.25215977 47.1424737,7.60777386 48.8291987,8.44926752 C49.6471616,8.85728442 50.3894112,9.37200203 50.9883232,10.0814175 C52.1241042,11.4270823 52.1870369,13.0236379 51.1427428,14.4531802 C50.2692891,15.6488048 49.0575521,16.3785717 47.7362896,16.939595 C45.8319696,17.7483781 43.8334933,18.0646901 41.7343085,18.0901499 Z M42.2525728,14.9727591 C42.5803404,14.9257943 43.0931042,14.8878929 43.5888001,14.7731999 C44.3976224,14.5860823 45.1589621,14.2730661 45.7381368,13.6307196 C46.3948854,12.9024358 46.3660075,12.0051612 45.6552242,11.3362013 C45.4505717,11.1435633 45.2166369,10.9399668 44.9599719,10.8561717 C44.2868836,10.6365084 43.6031177,10.4020964 42.906652,10.3162415 C41.7787173,10.1771598 40.6772338,10.3890781 39.6610896,10.9299147 C39.3555668,11.0924788 39.0599936,11.3045619 38.8160284,11.5514978 C38.0607555,12.3157879 38.106782,13.294221 38.9275761,13.9847682 C39.8373496,14.7501295 40.9356784,14.9218394 42.2525728,14.9727591 Z M128.251046,17.6288651 C128.739462,16.2691108 129.192529,15.0110313 129.643411,13.7521277 C131.03068,9.87835661 132.420942,6.005739 133.796725,2.12776576 C133.911185,1.80510942 134.061317,1.69980942 134.398953,1.70368196 C137.524313,1.73952351 140.650481,1.72905942 143.775355,1.78896013 C145.31397,1.81845731 146.84215,2.03523689 148.263878,2.69117844 C149.880795,3.43725942 151.119387,4.56334323 151.530553,6.40765872 C151.850474,7.842639 151.492939,9.18616154 150.863531,10.4624503 C149.757356,12.7053897 147.965393,14.2498721 145.855692,15.4478862 C143.628054,16.7128869 141.208301,17.3809404 138.682419,17.4772594 C135.237867,17.6086784 131.787571,17.5849489 128.251046,17.6288651 Z M136.249967,15.1384953 C136.625702,15.106032 137.002651,15.0846094 137.37685,15.0392925 C139.387217,14.7957348 141.3027,14.2292735 142.912255,12.9463932 C144.623571,11.5823545 145.690191,9.81927985 145.587136,7.50539886 C145.508754,5.7453728 144.566139,4.59621858 142.869222,4.33576999 C141.850651,4.17938548 140.804092,4.18960238 139.769262,4.17089886 C138.666241,4.15104182 138.452853,4.31179323 138.070484,5.36504041 C137.085806,8.07680379 136.112777,10.7929341 135.135217,13.5073341 C134.677297,14.7788439 134.925307,15.1386601 136.249967,15.1384953 Z"></path>
</svg>
</a>
<span class="header__overlay header__trigger--close"></span>
<div class="header__nav">
<div class="header__nav__inner">
<div class="header__mainNav">
<style>
.megaMenu_btnlist {
display: flex;
text-align: center;
}
.megaMenu_btn{
margin-right: var(--gap--8);
}
.button__label {
padding-inline: 10px;
}
/* Responsive layout - makes a one column-layout instead of a row */
@media (max-width: 800px) {
.megaMenu_btnlist {
flex-direction: column;
}
.megaMenu_btn{
margin-bottom: var(--gap--8);
}
}
</style>
<nav class="mainNav">
<ul class="mainNav__list">
<li class="mainNav__item">
<a href="/en/" class="mainNav__link">Home</a>
</li>
<li class="mainNav__item">
<section class="megaMenu">
<a class="mainNav__link megaMenu__trigger">Products</a>
<span class="megaMenu__icon megaMenu__trigger"></span>
<div class="megaMenu__target">
<div class="megaMenu__inner">
<div class="megaMenu__links">
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/product/player/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M31.77 28.6c-8.23 0-14.9 6.67-14.9 14.9s6.67 14.9 14.9 14.9 14.9-6.67 14.9-14.9S40 28.6 31.77 28.6Zm0 27.79c-7.11 0-12.9-5.79-12.9-12.9s5.79-12.9 12.9-12.9 12.9 5.79 12.9 12.9-5.79 12.9-12.9 12.9Z"/><path fill="currentColor" d="M31.77 37.6c-3.26 0-5.9 2.64-5.9 5.9s2.64 5.9 5.9 5.9 5.9-2.64 5.9-5.9-2.64-5.9-5.9-5.9Zm0 9.79c-2.15 0-3.9-1.75-3.9-3.9s1.75-3.9 3.9-3.9 3.9 1.75 3.9 3.9-1.75 3.9-3.9 3.9ZM16.02 23.73h4v2h-4zM23.02 23.73h4v2h-4zM30.02 23.73h4v2h-4zM37.02 23.73h4v2h-4zM44.02 23.73h4v2h-4z"/><circle cx="14.72" cy="57.02" r="2" fill="currentColor"/><circle cx="14.72" cy="50.18" r="2" fill="currentColor"/><path fill="currentColor" d="M47.68 48.05h2v1h-2zM47.68 46.05h2v1h-2zM47.68 50.05h2v1h-2zM46.68 52.05h4v1h-4zM47.68 54.05h2v1h-2zM47.68 56.05h2v1h-2zM47.68 58.05h2v1h-2z"/><path fill="currentColor" d="M47.77 5.48v-4h-32v4h-7v57.6h46V5.48h-7Zm-30 0v-2h28v16h-28v-14Zm35 55.6h-42V7.48h5v14h32v-14h5v53.6Z"/><circle cx="13.88" cy="30.11" r="1" fill="currentColor"/><circle cx="17.88" cy="30.11" r="1" fill="currentColor"/></svg>
</span>DJ Players / Turntables</a> </li>
<li class="megaMenu__item">
<a href="/en/product/mixer/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><circle cx="13.56" cy="26.23" r="1" fill="currentColor"/><circle cx="13.56" cy="22.23" r="1" fill="currentColor"/><circle cx="13.56" cy="18.23" r="1" fill="currentColor"/><path fill="currentColor" d="M56.61 3.16H7.53V61.4h49.08V3.16Zm-2 17.94h-6v-4h6v4Zm0 38.3H9.53V5.16h45.08v9.94h-8v14h8v30.3Zm0-32.3h-6v-4h6v4Z"/><path fill="currentColor" d="M27.57 54.24h1v2h-1zM25.57 54.24h1v2h-1zM29.57 54.24h1v2h-1zM31.57 53.24h1v4h-1zM33.57 54.24h1v2h-1zM35.57 54.24h1v2h-1zM37.57 54.24h1v2h-1z"/><circle cx="13.56" cy="41.47" r="2" fill="currentColor"/><circle cx="13.56" cy="48.35" r="2" fill="currentColor"/><path fill="currentColor" d="M19.64 45.45h4v1h-4zM19.64 43.45h4v1h-4zM19.64 35.36h4v2h-4zM19.64 39.36h4v2h-4zM19.64 47.45h4v1h-4zM19.64 49.45h4v1h-4z"/><circle cx="21.54" cy="26.23" r="1" fill="currentColor"/><circle cx="21.54" cy="22.23" r="1" fill="currentColor"/><circle cx="21.54" cy="18.23" r="1" fill="currentColor"/><circle cx="21.54" cy="14.23" r="1" fill="currentColor"/><circle cx="21.54" cy="9.23" r="1" fill="currentColor"/><circle cx="21.54" cy="31.29" r="2" fill="currentColor"/><path fill="currentColor" d="M26.65 45.45h4v1h-4zM26.65 43.45h4v1h-4zM26.65 35.36h4v2h-4zM26.65 39.36h4v2h-4zM26.65 47.45h4v1h-4zM26.65 49.45h4v1h-4z"/><circle cx="28.55" cy="26.23" r="1" fill="currentColor"/><circle cx="28.55" cy="22.23" r="1" fill="currentColor"/><circle cx="28.55" cy="18.23" r="1" fill="currentColor"/><circle cx="28.55" cy="14.23" r="1" fill="currentColor"/><circle cx="28.55" cy="9.23" r="1" fill="currentColor"/><circle cx="28.55" cy="31.29" r="2" fill="currentColor"/><path fill="currentColor" d="M33.62 45.45h4v1h-4zM33.62 43.45h4v1h-4zM33.62 35.36h4v2h-4zM33.62 39.36h4v2h-4zM33.62 47.45h4v1h-4zM33.62 49.45h4v1h-4z"/><circle cx="35.53" cy="26.23" r="1" fill="currentColor"/><circle cx="35.53" cy="22.23" r="1" fill="currentColor"/><circle cx="35.53" cy="18.23" r="1" fill="currentColor"/><circle cx="35.53" cy="14.23" r="1" fill="currentColor"/><circle cx="35.53" cy="9.23" r="1" fill="currentColor"/><circle cx="35.53" cy="31.29" r="2" fill="currentColor"/><path fill="currentColor" d="M40.6 45.45h4v1h-4zM40.6 43.45h4v1h-4zM40.6 35.36h4v2h-4zM40.6 39.36h4v2h-4zM40.6 47.45h4v1h-4zM40.6 49.45h4v1h-4z"/><circle cx="42.5" cy="26.23" r="1" fill="currentColor"/><circle cx="42.5" cy="22.23" r="1" fill="currentColor"/><circle cx="42.5" cy="18.23" r="1" fill="currentColor"/><circle cx="42.5" cy="14.23" r="1" fill="currentColor"/><circle cx="42.5" cy="9.23" r="1" fill="currentColor"/><circle cx="42.5" cy="31.29" r="2" fill="currentColor"/><circle cx="50.56" cy="55.3" r="1" fill="currentColor"/><circle cx="13.56" cy="55.3" r="1" fill="currentColor"/><circle cx="50.56" cy="51.3" r="1" fill="currentColor"/><circle cx="50.56" cy="47.3" r="1" fill="currentColor"/><circle cx="50.56" cy="43.3" r="1" fill="currentColor"/><circle cx="50.56" cy="39.3" r="1" fill="currentColor"/><circle cx="50.56" cy="35.3" r="1" fill="currentColor"/></svg>
</span>DJ mixers</a> </li>
<li class="megaMenu__item">
<a href="/en/product/all-in-one-system/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M54.02 17.44v-6.58h-6.01V8.4H16.23v9.04H1.03v38.73h62V17.44h-9.01Zm-35.78 0V10.4h27.77v14H18.23v-6.96Zm33.78 4.49h-3.98v-9.07h3.98v9.07Zm9.01 32.24h-58V19.44h13.21v6.96h31.77v-2.46h6.01v-4.49h7.01v34.72Z"/><path fill="currentColor" d="M27.46 49.26h1v2h-1zM29.46 49.26h1v2h-1zM27.3 41.75h2v1h-2zM27.3 43.75h2v1h-2zM27.3 45.75h2v1h-2zM31.46 48.26h1v4h-1zM33.46 49.26h1v2h-1zM35.46 49.26h1v2h-1z"/><circle cx="28.3" cy="31.16" r="1" fill="currentColor"/><circle cx="28.3" cy="34.17" r="1" fill="currentColor"/><circle cx="28.3" cy="38.17" r="2" fill="currentColor"/><path fill="currentColor" d="M34.75 41.75h2v1h-2zM34.75 43.75h2v1h-2zM34.75 45.75h2v1h-2z"/><circle cx="35.75" cy="31.16" r="1" fill="currentColor"/><circle cx="35.75" cy="34.17" r="1" fill="currentColor"/><circle cx="35.75" cy="38.17" r="2" fill="currentColor"/><path fill="currentColor" d="M9.95 45.26h2v2h-2zM13.95 45.26h2v2h-2zM17.95 45.26h2v2h-2zM9.95 49.26h2v2h-2zM13.95 49.26h2v2h-2zM17.95 49.26h2v2h-2zM21.95 45.26h2v2h-2zM56.67 22.39h2v2h-2zM21.95 49.26h2v2h-2z"/><circle cx="6.6" cy="49.69" r="1.5" fill="currentColor"/><circle cx="6.6" cy="44.69" r="1.5" fill="currentColor"/><path fill="currentColor" d="M45 45.26h2v2h-2zM49 45.26h2v2h-2zM53 45.26h2v2h-2zM45 49.26h2v2h-2zM49 49.26h2v2h-2zM53 49.26h2v2h-2zM57 45.26h2v2h-2zM57 49.26h2v2h-2z"/><circle cx="41.64" cy="49.69" r="1.5" fill="currentColor"/><circle cx="41.64" cy="44.69" r="1.5" fill="currentColor"/><path fill="currentColor" d="M14.79 27.99c-4.2 0-7.61 3.41-7.61 7.61s3.41 7.61 7.61 7.61 7.61-3.41 7.61-7.61-3.41-7.61-7.61-7.61Zm0 13.22c-3.09 0-5.61-2.52-5.61-5.61s2.52-5.61 5.61-5.61 5.61 2.52 5.61 5.61-2.52 5.61-5.61 5.61Z"/><circle cx="14.79" cy="35.6" r="2" fill="currentColor"/><path fill="currentColor" d="M41.79 35.6c0 4.2 3.41 7.61 7.61 7.61s7.61-3.41 7.61-7.61-3.41-7.61-7.61-7.61-7.61 3.41-7.61 7.61Zm13.22 0c0 3.09-2.52 5.61-5.61 5.61s-5.61-2.52-5.61-5.61 2.52-5.61 5.61-5.61 5.61 2.52 5.61 5.61Z"/><circle cx="49.4" cy="35.6" r="2" fill="currentColor"/><circle cx="7.24" cy="23.61" r="1" fill="currentColor"/><circle cx="11.24" cy="23.61" r="1" fill="currentColor"/></svg>
</span>All-in-one DJ systems</a> </li>
<li class="megaMenu__item">
<a href="/en/product/controller/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M.99 12.91v38.73h62V12.91h-62Zm60 36.73h-58V14.91h58v34.73Z"/><path fill="currentColor" d="M14.11 38.68c4.42 0 8-3.58 8-8s-3.58-8-8-8-8 3.58-8 8 3.58 8 8 8Zm0-14c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6 2.69-6 6-6ZM27.49 44.74h1v2h-1zM29.49 44.74h1v2h-1zM31.49 43.74h1v4h-1zM33.49 44.74h1v2h-1zM35.49 44.74h1v2h-1zM24.99 35.68h2v1h-2zM24.99 37.68h2v1h-2zM24.99 39.68h2v1h-2z"/><circle cx="25.99" cy="19.09" r="1" fill="currentColor"/><circle cx="19.99" cy="20.09" r="2" fill="currentColor"/><circle cx="25.99" cy="22.1" r="1" fill="currentColor"/><circle cx="25.99" cy="25.1" r="1" fill="currentColor"/><circle cx="25.99" cy="28.1" r="1" fill="currentColor"/><path fill="currentColor" d="M28.99 35.68h2v1h-2zM28.99 37.68h2v1h-2zM28.99 39.68h2v1h-2z"/><circle cx="29.99" cy="19.09" r="1" fill="currentColor"/><circle cx="29.99" cy="22.1" r="1" fill="currentColor"/><circle cx="29.99" cy="25.1" r="1" fill="currentColor"/><circle cx="29.99" cy="28.1" r="1" fill="currentColor"/><path fill="currentColor" d="M32.99 35.68h2v1h-2zM32.99 37.68h2v1h-2zM32.99 39.68h2v1h-2z"/><circle cx="33.99" cy="19.09" r="1" fill="currentColor"/><circle cx="33.99" cy="22.1" r="1" fill="currentColor"/><circle cx="33.99" cy="25.1" r="1" fill="currentColor"/><circle cx="33.99" cy="28.1" r="1" fill="currentColor"/><path fill="currentColor" d="M36.99 35.68h2v1h-2zM36.99 37.68h2v1h-2zM36.99 39.68h2v1h-2z"/><circle cx="37.99" cy="19.09" r="1" fill="currentColor"/><circle cx="37.99" cy="22.1" r="1" fill="currentColor"/><circle cx="37.99" cy="25.1" r="1" fill="currentColor"/><circle cx="37.99" cy="28.1" r="1" fill="currentColor"/><circle cx="25.99" cy="32.1" r="1" fill="currentColor"/><circle cx="29.99" cy="32.1" r="1" fill="currentColor"/><circle cx="33.99" cy="32.1" r="1" fill="currentColor"/><circle cx="37.99" cy="32.1" r="1" fill="currentColor"/><path fill="currentColor" d="M9.91 40.74h2v2h-2zM13.91 40.74h2v2h-2zM17.91 40.74h2v2h-2zM9.91 44.74h2v2h-2zM13.91 44.74h2v2h-2zM17.91 44.74h2v2h-2zM52.63 17.87h2v2h-2zM56.63 17.87h2v2h-2z"/><circle cx="6.55" cy="45.17" r="1.5" fill="currentColor"/><circle cx="6.55" cy="40.17" r="1.5" fill="currentColor"/><path fill="currentColor" d="M46.96 40.74h2v2h-2zM50.96 40.74h2v2h-2zM54.96 40.74h2v2h-2zM46.96 44.74h2v2h-2zM50.96 44.74h2v2h-2zM54.96 44.74h2v2h-2z"/><circle cx="43.6" cy="45.17" r="1.5" fill="currentColor"/><circle cx="43.6" cy="40.17" r="1.5" fill="currentColor"/><circle cx="14.11" cy="30.68" r="2.1" fill="currentColor"/><path fill="currentColor" d="M50.22 38.68c4.42 0 8-3.58 8-8s-3.58-8-8-8-8 3.58-8 8 3.58 8 8 8Zm0-14c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6 2.69-6 6-6Z"/><circle cx="50.22" cy="30.68" r="2.1" fill="currentColor"/><circle cx="7.2" cy="19.09" r="1" fill="currentColor"/><circle cx="11.2" cy="19.09" r="1" fill="currentColor"/><circle cx="44.03" cy="19.09" r="1" fill="currentColor"/><circle cx="48.03" cy="19.09" r="1" fill="currentColor"/></svg>
</span>DJ controllers</a> </li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/product/software/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M50.95 30.94h2v4h-2zM46.95 30.94h2v4h-2zM42.95 28.94h2v8h-2zM38.95 26.94h2v12h-2zM34.95 30.94h2v4h-2zM30.95 28.94h2v8h-2zM26.95 26.94h2v12h-2zM22.95 30.94h2v4h-2zM18.95 28.94h2v8h-2zM14.95 26.94h2v12h-2zM10.95 30.94h2v4h-2z"/><path fill="currentColor" d="M56.84 46.97h.02V17.51c0-1.1-.9-2-2-2H9.03c-1.1 0-2 .9-2 2v29.45H1.9v2h60.09v-2h-5.15ZM9.03 17.51h45.83v29.45H9.03V17.51Z"/></svg>
</span>Softwares / Interfaces</a> </li>
<li class="megaMenu__item">
<a href="/en/product/dj-sampler/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M49.13 5.13V1.12h-34v4.01H7v58.31h50.15V5.13h-8.02Zm-31.86 0V3.26h29.72v11.72H17.27V5.13Zm37.88 56.31H9V7.13h6.13v9.99h34V7.13h6.02v54.31Z"/><path fill="currentColor" d="M10.99 9.13h2v2h-2zM19.13 49.54h2v4h-2zM23.13 49.54h2v4h-2zM27.13 49.54h2v4h-2zM31.13 49.54h2v4h-2zM35.13 49.54h2v4h-2zM39.13 49.54h2v4h-2zM19.13 55.54h2v4h-2zM23.13 55.54h2v4h-2zM27.13 55.54h2v4h-2zM31.13 55.54h2v4h-2zM35.13 55.54h2v4h-2zM39.13 55.54h2v4h-2zM43.13 49.54h2v4h-2zM43.13 55.54h2v4h-2zM50.14 42.6h2v1h-2zM50.14 40.6h2v1h-2zM50.14 38.6h2v1h-2zM49.14 35.6h4v2h-4zM50.14 44.6h2v1h-2zM50.14 46.6h2v1h-2zM50.14 29.6h2v1h-2zM50.14 27.6h2v1h-2zM50.14 25.6h2v1h-2zM50.14 31.6h2v1h-2zM50.14 33.6h2v1h-2z"/><circle cx="13.15" cy="51.27" r="2" fill="currentColor"/><circle cx="13.15" cy="57.27" r="2" fill="currentColor"/><circle cx="13.15" cy="46.27" r="1" fill="currentColor"/><circle cx="13.15" cy="18.79" r="1" fill="currentColor"/><circle cx="51.14" cy="22.6" r="1" fill="currentColor"/><circle cx="52.17" cy="10.13" r="1" fill="currentColor"/><path fill="currentColor" d="M12.15 29.1h2v12h-2zM12.15 23.01h2v4h-2zM49.14 51.54h4v2h-4zM49.14 55.54h4v2h-4zM19.13 20.07h4.73v4.73h-4.73zM26.22 20.07h4.73v4.73h-4.73zM33.31 20.07h4.73v4.73h-4.73zM40.4 20.07h4.73v4.73H40.4zM19.13 27.16h4.73v4.73h-4.73zM26.22 27.16h4.73v4.73h-4.73zM33.31 27.16h4.73v4.73h-4.73zM40.4 27.16h4.73v4.73H40.4zM19.13 34.25h4.73v4.73h-4.73zM26.22 34.25h4.73v4.73h-4.73zM33.31 34.25h4.73v4.73h-4.73zM40.4 34.25h4.73v4.73H40.4zM19.13 41.34h4.73v4.73h-4.73zM26.22 41.34h4.73v4.73h-4.73zM33.31 41.34h4.73v4.73h-4.73zM40.4 41.34h4.73v4.73H40.4z"/></svg>
</span>DJ samplers</a> </li>
<li class="megaMenu__item">
<a href="/en/product/effector/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M60.94 16.18H3.13s-2 6.2-2 15.97 2 16.23 2 16.23h57.81s2-6.46 2-16.23-2-15.97-2-15.97ZM59.33 46.3H4.74c-.3-1.29-.72-3.4-1.05-6.11h29.52l2.89-2.56c1.96 3.97 6.03 6.71 10.76 6.71 6.63 0 12-5.37 12-12s-5.37-12-12-12c-4.71 0-8.77 2.71-10.73 6.66l-2.91-2.62H3.67c.32-2.73.75-4.84 1.06-6.11h54.62c.56 2.3 1.51 7.23 1.51 13.89s-.97 11.78-1.53 14.15ZM4.34 32.34c0-2.21 1.79-4 4-4s4 1.79 4 4-1.79 4-4 4-4-1.79-4-4Zm12 0c0-2.21 1.79-4 4-4s4 1.79 4 4-1.79 4-4 4-4-1.79-4-4Zm21.33-3.95c1.53-3.56 5.07-6.05 9.18-6.05 5.51 0 10 4.49 10 10s-4.49 10-10 10c-4.13 0-7.68-2.52-9.2-6.09l4.4-3.91-4.38-3.95Zm-9.33 3.95c0-2.21 1.79-4 4-4 1.12 0 2.13.46 2.85 1.2.71.72 1.15 1.71 1.15 2.8s-.44 2.08-1.15 2.8c-.73.74-1.74 1.2-2.85 1.2-2.21 0-4-1.79-4-4Z"/><circle cx="30.18" cy="43.22" r="1" fill="currentColor"/><circle cx="37.66" cy="43.22" r="1" fill="currentColor"/><circle cx="37.66" cy="21.32" r="1" fill="currentColor"/><circle cx="11.87" cy="43.22" r="1" fill="currentColor"/><circle cx="7.87" cy="43.22" r="1" fill="currentColor"/><circle cx="7.87" cy="21.32" r="1" fill="currentColor"/><circle cx="23.53" cy="21.32" r="1" fill="currentColor"/><path fill="currentColor" d="M14.92 42.22h12v2h-12zM15.2 20.32h1v2h-1zM17.2 20.32h1v2h-1zM19.2 20.32h1v2h-1zM13.2 20.32h1v2h-1zM11.2 20.32h1v2h-1zM46.85 37.14a4.801 4.801 0 0 0 0-9.6 4.801 4.801 0 0 0 0 9.6Z"/></svg>
</span>DJ effectors</a> </li>
<li class="megaMenu__item">
<a href="/en/product/production/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M.99 12.91v38.73h62V12.91h-62Zm60 36.73h-58V14.91h58v34.73Z"/><circle cx="5.98" cy="18.63" r="1" fill="currentColor"/><path fill="currentColor" d="M4.98 41.63h4v6h-4zM10.98 41.63h4v6h-4zM16.98 41.63h4v6h-4zM22.98 41.63h4v6h-4zM28.98 41.63h4v6h-4zM34.98 41.63h4v6h-4zM40.98 41.63h4v6h-4zM46.98 41.63h4v6h-4zM52.99 45.63h2v2h-2zM56.99 45.63h2v2h-2zM53.06 19.63h-20v14h20v-14Zm-2 12h-16v-10h16v10Z"/><circle cx="35.06" cy="36.63" r="1" fill="currentColor"/><circle cx="39.06" cy="36.63" r="1" fill="currentColor"/><circle cx="43.06" cy="36.63" r="1" fill="currentColor"/><circle cx="47.06" cy="36.63" r="1" fill="currentColor"/><circle cx="51.06" cy="36.63" r="1" fill="currentColor"/><path fill="currentColor" d="M4.98 21.63h2v16h-2zM10.13 17.63h5v5h-5zM17.63 17.63h5v5h-5zM25.13 17.63h5v5h-5zM10.13 25.13h5v5h-5zM17.63 25.13h5v5h-5zM25.13 25.13h5v5h-5zM10.13 32.63h5v5h-5zM17.63 32.63h5v5h-5zM25.13 32.63h5v5h-5z"/><circle cx="56.97" cy="25.63" r="2" fill="currentColor"/><path fill="currentColor" d="M54.97 35.63h4v2h-4zM54.97 31.63h4v2h-4zM55.97 17.63h2v2h-2z"/></svg>
</span>Music production</a> </li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/product/headphones/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="m50.4 23.21.1 1c.5 4.25 4.08 7.56 8.46 7.56h1v-2h-1c-.27 0-.52-.05-.78-.08l1.35-2.72-3.49-1.76-1.43 2.88c-1.35-1.2-2.21-2.93-2.21-4.88l-.05-1c-.53-10.83-9.47-19.48-20.43-19.48s-19.91 8.66-20.44 19.48l-.05 1c0 1.94-.87 3.67-2.21 4.88l-1.43-2.88-3.49 1.76 1.35 2.72c-.26.03-.51.08-.78.08h-1v2h1c4.38 0 7.96-3.32 8.46-7.56l.1-1c0-10.19 8.29-18.48 18.48-18.48s18.48 8.29 18.48 18.48ZM51.78 32.83l-.82 1.82 7.01 3.16-5 11.09c.47-1.53.81-3.02.94-4.35.25-2.61-.26-4.3-1.45-4.93v-.03l-.11-.05-.66-.3-8.28-3.73L33.4 57.62l6.54 2.94 2.33 1.05.21.09v-.02c.25.09.5.16.77.16 2.63 0 6.19-4.45 8.39-9.32.16-.36.29-.71.44-1.07l1.64.74 6.92-15.36-8.84-3.98ZM41.47 59.04l-5.43-2.44 8.36-18.46 4.18 1.88 1.24.56-8.36 18.46Zm10.45-14.69c-.21 2.12-.98 4.8-2.12 7.33-2.6 5.76-5.65 8.14-6.48 8.12l8.31-18.35c.18.27.47 1.07.29 2.9ZM20.42 35.49l-8.28 3.73-.66.3-.12.05v.03c-1.18.64-1.69 2.32-1.43 4.93.13 1.34.46 2.82.94 4.35l-5-11.09 7.01-3.16-.82-1.82-8.84 3.98 6.92 15.36 1.64-.74c.15.36.28.71.44 1.07 2.2 4.87 5.75 9.32 8.39 9.32.26 0 .51-.07.75-.16v.02l.22-.09 2.33-1.04 6.54-2.95-10.01-22.11Zm-6.39 16.19c-1.14-2.53-1.92-5.2-2.12-7.33-.18-1.83.11-2.63.29-2.9l8.31 18.35c-.82.01-3.88-2.36-6.48-8.12Zm8.33 7.36L14 40.58l1.24-.56 4.18-1.89 8.36 18.46-5.43 2.44Z"/></svg>
</span>Headphones</a> </li>
<li class="megaMenu__item">
<a href="/en/product/monitor-speakers/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><circle cx="32.04" cy="57.19" r="1" fill="currentColor"/><circle cx="32.04" cy="36.61" r="4" fill="currentColor"/><path fill="currentColor" d="M32.04 27.61a9 9 0 1 0 .001 18.001 9 9 0 0 0-.001-18.001Zm0 16c-3.86 0-7-3.14-7-7s3.14-7 7-7 7 3.14 7 7-3.14 7-7 7Z"/><path fill="currentColor" d="M46.04 36.61c0-7.73-6.27-14-14-14s-14 6.27-14 14 6.27 14 14 14 14-6.27 14-14Zm-14 12c-6.62 0-12-5.38-12-12s5.38-12 12-12 12 5.38 12 12-5.38 12-12 12Z"/><path fill="currentColor" d="M11.16 2.93v58.7h41.77V2.93H11.16Zm39.77 18.46c-2.12-7.34-5.64-13.75-7.25-16.47h7.25v16.47ZM37.86 58.67v.95H26.27v-.95c0-1.4-.79-3.15-1.83-4.07-.11-.1-10.95-9.86-10.95-22.4 0-11.75 8.02-25.2 9.3-27.28h18.56c1.28 2.08 9.3 15.52 9.3 27.28 0 12.53-10.84 22.3-10.96 22.4-1.04.93-1.83 2.68-1.83 4.07ZM20.45 4.93c-1.62 2.73-5.17 9.22-7.29 16.61V4.93h7.29Zm-7.29 36.4c3.13 8.63 9.59 14.45 9.95 14.77.61.54 1.16 1.76 1.16 2.58v.95H13.16v-18.3Zm26.7 18.3v-.95c0-.81.55-2.04 1.16-2.58.36-.32 6.76-6.08 9.91-14.64v18.18H39.86Z"/><circle cx="32.04" cy="13.53" r="2" fill="currentColor"/><path fill="currentColor" d="M32.04 20.13c5.56 0 9.92-2.9 9.92-6.6s-4.36-6.6-9.92-6.6-9.92 2.9-9.92 6.6 4.36 6.6 9.92 6.6Zm0-11.21c4.29 0 7.92 2.11 7.92 4.6s-3.63 4.6-7.92 4.6-7.92-2.11-7.92-4.6 3.63-4.6 7.92-4.6Z"/></svg>
</span>Monitor speakers</a> </li>
<li class="megaMenu__item">
<a href="https://alphatheta.com/product/portable-dj-speaker/wave-eight/black/" class="megaMenu__link" rel="noopener noreferrer" target="_blank" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M52.91 1.91H11.1v58.71h3.23v2.03h6v-2.03h23.35v2.03h6v-2.03h3.23V1.91Zm-2 25.25h-5.96v2h5.96v29.46H13.1V29.16h6.28v-2H13.1V3.91h37.81v23.25Z"/><path fill="currentColor" d="M45.93 6.91H18.08v17.18h27.85V6.91Zm-2 15.18H20.08V8.91h23.85v13.18Z"/><path fill="currentColor" d="M32 19.36c4.52 0 8.18-1.8 8.18-3.86s-3.66-3.86-8.18-3.86-8.18 1.97-8.18 3.86 3.66 3.86 8.18 3.86ZM32 37.34c-2.37 0-4.29 1.92-4.29 4.29s1.92 4.29 4.29 4.29 4.29-1.92 4.29-4.29-1.92-4.29-4.29-4.29Z"/><path fill="currentColor" d="M32 31.98c-5.33 0-9.64 4.32-9.64 9.64s4.32 9.64 9.64 9.64 9.64-4.32 9.64-9.64-4.32-9.64-9.64-9.64Zm0 17.14c-4.14 0-7.5-3.36-7.5-7.5s3.36-7.5 7.5-7.5 7.5 3.36 7.5 7.5-3.36 7.5-7.5 7.5Z"/><path fill="currentColor" d="M32 26.63c-8.28 0-15 6.72-15 15s6.72 15 15 15 15-6.72 15-15-6.72-15-15-15Zm0 27.86c-7.09 0-12.86-5.77-12.86-12.86S24.91 28.77 32 28.77s12.86 5.77 12.86 12.86S39.09 54.49 32 54.49Z"/></svg>
</span>Portable DJ Speakers</a> </li>
<li class="megaMenu__item">
<a href="/en/product/pa-speakers/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M52.91 1.91H11.1v58.71h3.23v2.03h6v-2.03h23.35v2.03h6v-2.03h3.23V1.91Zm-2 25.25h-5.96v2h5.96v29.46H13.1V29.16h6.28v-2H13.1V3.91h37.81v23.25Z"/><path fill="currentColor" d="M45.93 6.91H18.08v17.18h27.85V6.91Zm-2 15.18H20.08V8.91h23.85v13.18Z"/><path fill="currentColor" d="M32 19.36c4.52 0 8.18-1.8 8.18-3.86s-3.66-3.86-8.18-3.86-8.18 1.97-8.18 3.86 3.66 3.86 8.18 3.86ZM32 37.34c-2.37 0-4.29 1.92-4.29 4.29s1.92 4.29 4.29 4.29 4.29-1.92 4.29-4.29-1.92-4.29-4.29-4.29Z"/><path fill="currentColor" d="M32 31.98c-5.33 0-9.64 4.32-9.64 9.64s4.32 9.64 9.64 9.64 9.64-4.32 9.64-9.64-4.32-9.64-9.64-9.64Zm0 17.14c-4.14 0-7.5-3.36-7.5-7.5s3.36-7.5 7.5-7.5 7.5 3.36 7.5 7.5-3.36 7.5-7.5 7.5Z"/><path fill="currentColor" d="M32 26.63c-8.28 0-15 6.72-15 15s6.72 15 15 15 15-6.72 15-15-6.72-15-15-15Zm0 27.86c-7.09 0-12.86-5.77-12.86-12.86S24.91 28.77 32 28.77s12.86 5.77 12.86 12.86S39.09 54.49 32 54.49Z"/></svg>
</span>PA speakers</a> </li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/product/accessories/" class="megaMenu__link" > <span class="megaMenu__link__icon">
<svg class="symbol" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path fill="currentColor" d="M21.29 35.25c-.28.77-.48 1.57-.58 2.38l3.96.52c.07-.52.19-1.03.37-1.53l-3.76-1.37ZM36.41 20.24c-.71-.16-1.45-.29-2.21-.38l-.45 3.98c.6.07 1.18.17 1.75.3l.9-3.9ZM40.64 21.77c-.67-.34-1.37-.64-2.07-.9l-1.36 3.76c.56.2 1.1.44 1.62.7l1.82-3.56ZM41.72 27.31l2.66-2.99c-.56-.5-1.16-.97-1.79-1.39l-2.25 3.3c.49.33.95.69 1.38 1.08ZM29.37 32.33l-1.35-3.77c-.77.28-1.5.64-2.2 1.07l2.14 3.38c.45-.28.92-.51 1.41-.69ZM28.44 24.13l-.9-3.9c-.73.17-1.45.38-2.15.63l1.35 3.77c.55-.2 1.12-.37 1.71-.5ZM20.65 40.05c.06.77.2 1.55.4 2.33l3.87-1.02a9.43 9.43 0 0 1-.28-1.63l-3.99.32ZM26.73 33.99l-2.82-2.84c-.58.58-1.09 1.21-1.53 1.9l3.37 2.16c.28-.44.62-.85.99-1.22ZM39.51 47.78l1.84 3.55c.67-.35 1.33-.75 1.95-1.19l-2.31-3.27c-.47.33-.97.64-1.48.9ZM48.97 43.07l-3.7-1.52c-.22.53-.47 1.04-.77 1.53l3.44 2.05c.39-.66.74-1.36 1.03-2.06ZM46.63 47.01l-3.12-2.51c-.36.45-.75.87-1.18 1.27l2.73 2.92c.56-.52 1.08-1.09 1.56-1.68ZM49.85 34.06l-3.93.71c.1.57.17 1.15.19 1.72l4-.17c-.03-.75-.12-1.52-.26-2.27ZM44.85 31.47c.25.53.47 1.07.65 1.62l3.8-1.25c-.24-.73-.52-1.43-.84-2.1l-3.61 1.73ZM42.94 28.56c.38.44.73.91 1.05 1.39l3.34-2.2c-.41-.63-.87-1.24-1.37-1.81l-3.03 2.61ZM50.06 38.6l-3.98-.36c-.05.57-.14 1.13-.28 1.67l3.88.97c.18-.74.31-1.51.38-2.29ZM31.98 23.73l-.04-4c-.76 0-1.47.04-2.19.12l.45 3.98c.57-.06 1.17-.11 1.78-.1ZM20.73 49.5l-2.97 2.68c.49.55 1.01 1.07 1.56 1.57l2.69-2.96c-.45-.41-.87-.84-1.28-1.29ZM18.64 46.6l-3.47 1.98c.37.64.77 1.27 1.2 1.87l3.24-2.34c-.35-.48-.68-.99-.97-1.51ZM23.41 51.94l-2.39 3.21c.59.44 1.2.85 1.83 1.23l2.07-3.42c-.52-.31-1.02-.65-1.51-1.02ZM24.78 57.43c.66.32 1.34.6 2.03.86l1.39-3.75c-.57-.21-1.13-.45-1.68-.71l-1.73 3.61ZM34.75 53.11l-.19-4c-.54.02-1.1 0-1.64-.06l-.55 3.96c.54.08 1.09.12 1.66.12.24 0 .48 0 .72-.02ZM28.9 58.95c.72.19 1.44.34 2.17.46l.62-3.95c-.59-.09-1.18-.21-1.77-.37l-1.02 3.87ZM30.04 52.44l1.32-3.77c-.51-.18-1-.41-1.48-.68l-2.01 3.46c.69.4 1.42.74 2.16 1ZM36.27 48.91l.77 3.93c.75-.15 1.5-.35 2.22-.6l-1.32-3.77c-.54.19-1.1.34-1.66.45ZM19.69 29.84l-3.2-2.39c-.45.59-.86 1.21-1.24 1.86l3.45 2.02c.3-.52.63-1.01.99-1.49ZM17.9 32.9l-3.67-1.59c-.29.68-.56 1.38-.78 2.1l3.82 1.17c.18-.57.38-1.13.62-1.67ZM25.11 25.33l-1.79-3.58c-.67.34-1.32.71-1.94 1.12l2.19 3.35c.5-.32 1.01-.62 1.54-.88ZM22.14 27.27l-2.56-3.07c-.57.48-1.12.99-1.63 1.53l2.89 2.76c.41-.43.85-.84 1.3-1.22ZM16.86 36.3l-3.93-.72c-.13.73-.22 1.47-.27 2.23l3.99.25c.04-.6.11-1.19.21-1.76ZM16.83 41.61c-.1-.58-.16-1.17-.2-1.77l-3.99.22c.04.75.12 1.5.25 2.22l3.94-.67Z"/><path fill="currentColor" d="M57.45 4.89h-6v1h-4c-.55 0-1 .45-1 1s.45 1 1 1h4v1h2l.07 28.63c0 10.55-8.59 19.14-19.14 19.14v-1c-.3 0-.6 0-.89-.02l-.21 4c.37.02.74.03 1.11.03v-1c11.66 0 21.14-9.48 21.14-21.14V14.54l1.93-9.65Z"/><path fill="currentColor" d="M32.61 46.59c4.65 0 8.43-3.78 8.43-8.43 0-5.1-4.15-9.26-9.26-9.26v-1c-.41 0-.81.02-1.21.06l.43 3.98c.26-.03.52-.04.79-.04v-1c4 0 7.26 3.26 7.26 7.26 0 3.54-2.88 6.43-6.43 6.43H18.65c-4.88 0-8.84-3.96-8.84-8.84V16.66l1.04-2.83V8.58H9.83V4.99h-2v3.59H6.81v5.25l1 2.83v19.09c0 5.98 4.86 10.84 10.84 10.84h13.97Z"/></svg>
</span>Accessories</a> </li>
</ul>
</div>
<div class="megaMenu__aside">
<div class="megaMenu__aside__inner">
<a href="http://rekordbox.com" class="megaMenu__banner" target="_blank">
<span class="megaMenu__banner__visual responsiveImage--bg">
<em data-mq="small" href="https://preprod.pioneerdj.com/-/media/pioneerdj/images/navigation/dropdown-menu/rb6-mega-menu-banner-mobile-250x90.jpg?mh=90&w=250&hash=019BEEC30C5CECD8104BCFCDC9531771"></em>
<em data-mq="large" href="https://preprod.pioneerdj.com/-/media/pioneerdj/images/navigation/dropdown-menu/rb6-mega-menu-banner-320x200.jpg?h=200&w=320&hash=B21B6185B82A99FFEFD9F7634FF2D874"></em>
</span>
<div class="megaMenu__banner__content">
<p class="megaMenu__banner__title"></p>
<div class="megaMenu__banner__desc"></div>
</div>
<div class="megaMenu__banner__icon">
<span class="button button--subtle">
<i class="button__icon">
<svg class="symbol symbol--arro-right" viewBox="0 0 27 18" version="1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g transform="translate(-38 -1)" fill="none" fill-rule="evenodd">
<path class="theFill" d="M38.009 1.001h26.988L47.14 19.005v-6.65H38.01z"/>
<path class="theStroke" stroke="#395EE2" stroke-width="2" d="M39.009 2.001v9.355h9.131v5.22L62.597 2.002H39.009z"/>
</g>
</svg>
</i>
</span>
</div>
</a>
</div>
</div>
<div class="megaMenu__cta">
<ul class="megaMenu_btnlist">
<li class="megaMenu_btn">
<a href="/en/product/" class="button" > <span class=" button__label">All categories</span>
</a> </li>
<li class="megaMenu_btn"><a href="/en/product/archive/" class="button"><span class="button__label">Archived products</span></a></li>
</ul>
</div>
</div>
</div>
</section>
</li>
<li class="mainNav__item">
<a href="/en/news/" class="mainNav__link" >News</a>
</li>
<li class="mainNav__item">
<a href="http://blog.pioneerdj.com" class="mainNav__link" rel="noopener noreferrer" target="_blank" >Blog</a>
</li>
<li class="mainNav__item">
<section class="megaMenu">
<a class="mainNav__link megaMenu__trigger">Support</a>
<span class="megaMenu__icon megaMenu__trigger"></span>
<div class="megaMenu__target">
<div class="megaMenu__inner">
<div class="megaMenu__links">
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/articles/11949537649305" class="megaMenu__link" rel="noopener noreferrer" target="_blank" > <span class="megaMenu__link__icon">
</span>Downloads (Firmware, driver etc.)</a> </li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/articles/11949532807193" class="megaMenu__link" rel="noopener noreferrer" target="_blank" > <span class="megaMenu__link__icon">
</span>Manuals & documentation</a> </li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/articles/11949656174617" class="megaMenu__link" rel="noopener noreferrer" target="_blank" > <span class="megaMenu__link__icon">
</span>DJ Application & OS Support information</a> </li>
<li class="megaMenu__item">
<a href="/en/landing/technical-riders/" class="megaMenu__link" > <span class="megaMenu__link__icon">
</span>Technical Riders</a> </li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="/en/support/support-archive/" class="megaMenu__link" > <span class="megaMenu__link__icon">
</span>Archived products</a> </li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us" class="megaMenu__link" rel="noopener noreferrer" target="_blank" > <span class="megaMenu__link__icon">
</span>FAQ (Visit Help Center)</a> </li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/categories/4416914873369" class="megaMenu__link" rel="noopener noreferrer" target="_blank" > <span class="megaMenu__link__icon">
</span>Service centers</a> </li>
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/categories/4417227498393" class="megaMenu__link" rel="noopener noreferrer" target="_blank" > <span class="megaMenu__link__icon">
</span>Contact</a> </li>
</ul>
<ul class="megaMenu__list">
<li class="megaMenu__item">
<a href="https://support.pioneerdj.com/hc/en-us/categories/4416175431577" class="megaMenu__link" rel="noopener noreferrer" target="_blank" > <span class="megaMenu__link__icon">
</span>AlphaTheta Account FAQ</a> </li>
</ul>
</div>
<div class="megaMenu__cta">
<ul class="megaMenu_btnlist">
<li class="megaMenu_btn">
<a href="https://support.pioneerdj.com/hc/en-us" class="button" rel="noopener noreferrer" target="_blank" > <span class=" button__label">All support</span>
</a> </li>
</ul>
</div>
</div>
</div>
</section>
</li>
<li class="mainNav__item">
<a href="https://alphatheta.com/en/store-locator/" class="mainNav__link" rel="noopener noreferrer" target="_blank" >Find a store</a>
</li>
</ul>
</nav>
</div>
<div class="header__actionNav">
<nav class="actionNav">
<div class="actionNav__item">
<div class="search">
<a class="search__trigger search__trigger--open header__trigger--close">
<svg class="symbol symbol--search" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 57">
<path fill="currentColor" d="M60 54.93 39.86 34.91a21.74 21.74 0 0 0 4.28-12.97C44.14 9.84 34.24 0 22.07 0S0 9.84 0 21.94s9.9 21.94 22.07 21.94c6.23 0 11.87-2.59 15.88-6.73L57.92 57 60 54.93ZM22.07 40.95c-10.55 0-19.13-8.53-19.13-19.02S11.52 2.92 22.07 2.92 41.2 11.45 41.2 21.94s-8.58 19.02-19.13 19.02Z" />
</svg>
</a>
<div class="search__inner">
<form action="/search-results" class="search__form">
<div class="search__field">
<input name="q" type="search" class="search__input input__search" data-search-page="/search-results?q=" data-no-results="Oops nothing can be found" data-nothing-entered="Please enter a search query">
<a href="#0" class="search__closeTrigger search__trigger--close">
<svg class="symbol symbol--close" viewBox="0 0 12 14" version="1" xmlns="http://www.w3.org/2000/svg">
<path d="M6.066 5.492L2.372.931A1 1 0 1 0 .818 2.19l3.848 4.752L.418 11.34a1 1 0 0 0 1.439 1.39v-.001l4.077-4.222 3.694 4.561a1 1 0 1 0 1.554-1.259L7.334 7.059l4.248-4.399a1 1 0 0 0-1.439-1.39v.001L6.066 5.492z" fill="currentColor" fill-rule="evenodd" />
</svg>
<span class="screenReader">Close</span>
</a>
</div>
<span class="search__loader"></span>
</form>
<div class="search__overlay search__trigger--close"></div>
<div class="search__results">
<div class="search__results__inner">
<h3 class="heading heading--2 heading--fancy">
Top results
</h3>
<ul class="search__list"><!-- POPULATED WITH JAVASCRIPT --></ul>
<a class="search__cta button trigger__searchpage"><span class="button__label">See all results</span></a>
<p class="search__note">
Didn’t find what you’re looking for? Maybe use fewer words or a more general search term.<br />If you still have no luck you can contact our <a href="/en/support/contact">customer service</a>.
</p>
</div>
</div>
</div>
</div>
</div>
</nav>
</div>
<div class="header__profileNav">
<nav class="profileNav">
<script>
dataLayer.push({ 'event': 'login_status', 'logged_in': 'false' });
</script>
<div class="profileNav__item">
<a href="/en/account/register/" class="profileNav__link">
<span class="profileNav__label">Register</span>
</a>
</div>
<div id="LoginRegister" class="profileNav__item">
<a href="/en/account/login/?relPath=en%2Fproduct%2Fcontroller%2Fddj-flx10%2Fblack%2Foverview%2F" class="profileNav__link">
<span class="profileNav__label">Log in</span>
</a>
</div>
<div class="profileNav__item profileNav__item--lang">
<a href="/selectCountry/" class="profileNav__link flag flag-INT" style="margin:0;width:20px"></a>
</div>
</nav>
<!--<script type="text/javascript">
synchroniseLoginStatus();
$("#loginlink").click(function () {
if (window.location.href.indexOf("account/about") > -1) {
document.getElementById("loginlink").setAttribute("target", "_blank")
}
});
</script>-->
<script type="text/javascript">
if (typeof synchroniseLoginStatus === typeof function() {}) {
synchroniseLoginStatus();
}
const loginlink = document.querySelector('#loginlink');
if (loginlink) {
loginlink.addEventListener('click', e => {
if (window.location.href.indexOf("account/about") > -1) {
loginlink.setAttribute("target", "_blank")
}
});
}
</script>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<script>
if (window.location.href.indexOf("/product-register/") > -1)
{
var urlQuery= window.location.href.split('?')[1];
var redURl= '/account/hardware/product-registration/?'+urlQuery;
console.log(redURl);
window.location.href=redURl;
}
</script>
<div id="the-bucket">
<style type="text/css">
@media screen and (max-width: 768px){
.visual img {
object-fit: contain;
}
.media__slide {
padding-top: 73.86667% !important ;
}
.hero-product__content
{
padding-bottom: var(--gap--10) !important;
}
}
</style>
<input type="hidden" id="ProductID" value="{A3F92FDD-27B2-4AF5-9F87-269D6E706D20}" />
<input type="hidden" id="ProductCategoryName" value="DDJ-FLX10" />
<div class="spacer spacer--6"></div>
<section class="hero-product">
<div class="hero-product__in">
<div class="hero-product__inner">
<div class="hero-product__media">
<section class="media media--slider">
<div class="media__slider swiper-container swiper-container-initialized swiper-container-horizontal">
<div class="swiper-wrapper" style="transform: translate3d(0px, 0px, 0px);">
<div class="swiper-slide" >
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png">
<a href="#"
data-zoomer="gallery"
data-zoomer-gallery="product-here"
data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png"
data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png"
>
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png" alt="pc-cgi_angle" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png' });">
</a>
</picture>
</div>
</div>
<div class="swiper-slide" >
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png">
<a href="#"
data-zoomer="gallery"
data-zoomer-gallery="product-here"
data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png"
data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png"
>
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png" alt="pc-cgi_frontangle" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png' });">
</a>
</picture>
</div>
</div>
<div class="swiper-slide" >
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png">
<a href="#"
data-zoomer="gallery"
data-zoomer-gallery="product-here"
data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png"
data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png"
>
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png" alt="pc-cgi_top" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png' });">
</a>
</picture>
</div>
</div>
<div class="swiper-slide" >
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png">
<a href="#"
data-zoomer="gallery"
data-zoomer-gallery="product-here"
data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png"
data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png"
>
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png" alt="pc-cgi_front" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png' });">
</a>
</picture>
</div>
</div>
<div class="swiper-slide" >
<div class="media__slide">
<picture class="visual">
<source srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png">
<a href="#"
data-zoomer="gallery"
data-zoomer-gallery="zoomer-id-ddjflx10"
data-zoomer-image-thumbnail="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png"
data-zoomer-image-large="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png"
>
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png" alt="pc-cgi_rear" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png' });">
</a>
</picture>
</div>
</div>
</div>
<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
</div>
<div class="media__thumbs swiper-container swiper-container-initialized swiper-container-horizontal swiper-container-free-mode thumbs-init swiper-container-thumbs">
<div class="swiper-wrapper" style="transform: translate3d(0px, 0px, 0px);">
<div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png?h=273&w=372&hash=D4FBA6798E5B0043D1CD544C00A9141E">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png?h=273&w=372&hash=D4FBA6798E5B0043D1CD544C00A9141E" alt="pc-cgi_angle" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_angle.png' });">
</picture>
</div>
</div> <div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png?h=273&w=372&hash=20FF9D1D001D50F3BC2F1E19CB4FC0F9">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png?h=273&w=372&hash=20FF9D1D001D50F3BC2F1E19CB4FC0F9" alt="pc-cgi_frontangle" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_frontangle.png' });">
</picture>
</div>
</div> <div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png?h=273&w=372&hash=09696ABE784490CFDBF86649C17419AF">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png?h=273&w=372&hash=09696ABE784490CFDBF86649C17419AF" alt="pc-cgi_top" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_top.png' });">
</picture>
</div>
</div> <div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png?h=273&w=372&hash=34C55502C148A0B633F7ADD09D877A65">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png?h=273&w=372&hash=34C55502C148A0B633F7ADD09D877A65" alt="pc-cgi_front" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_front.png' });">
</picture>
</div>
</div> <div class="swiper-slide" style="width: 124.154px; margin-right: 8px;">
<div class="media__thumb">
<picture class="visual">
<source media="(min-width: 750px)" data-srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png?h=273&w=372&hash=60DCE44A03D5DF2D37AEAEDE420A5DC6">
<img class="lazyload" data-src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png?h=273&w=372&hash=60DCE44A03D5DF2D37AEAEDE420A5DC6" alt="pc-cgi_rear" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Picture', 'dlLabel': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png', 'dlPosition': '', 'dlURL': 'https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx10/pc-cgi_rear.png' });">
</picture>
</div>
</div>
</div>
<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
</div>
</section>
</div>
<div class="hero-product__content">
<div class="hero-product__back caption">
<a href="/en/product/controller/" class="link link--underlined" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Back to parent page', 'dlLabel': 'DJ Controller', 'dlPosition': 'top', 'dlURL': '/en/product/controller/' });">
<span class="link__label">< DJ Controller</span>
</a>
</div>
<input type="hidden" id="productCurrentItem" value="{1A92247D-72E5-4073-A3BF-6219CC326799}" />
<div class="hero-product__logos">
</div>
<div class="hero-product__intro">
<h3 class="hero-product__heading heading" id="product_name">DDJ-FLX10</h3>
<div class="hero-product__description">
4-channel performance DJ controller for multiple DJ applications (Black)
</div>
</div>
<div class="hero-product__info">
<h3 class="hero-product__subheading heading"><img src="/-/media/pioneerdj/images/features/Controller/DDJ-FLX10/DDJ-FLX10_Strapline_550x45.png" alt="SPLIT.MIX.CREATE" style="width: 100%;"></h3>
<div class="hero-product__description p--2">
The DDJ-FLX10 is a 4-channel performance DJ controller for rekordbox and Serato DJ Pro. It includes a host of brand-new features including Track Separation technology, which enables new creative possibilities such as the easy performance of mash-ups on the fly with no need to prepare tracks in advance.
</div>
</div>
<div class="hero-product__colors">
<div class="hero-product__color">
<a href="/en/product/controller/ddj-flx10/black/overview/" class="radio-color" style="background: #000000;" title="Black" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Filter', 'dlElement': 'Color', 'dlLabel': 'Black', 'dlPosition': 'Middle', 'dlURL': '/en/product/controller/ddj-flx10/black/overview/' });"></a>
</div>
</div>
<div class="hero-product__price">
</div>
<section class="overlay-modal" data-modal="warranty-info">
<div class="overlay-modal__overlay">
<span class="overlay-modal__bg overlay-modal__trigger--close"></span>
<div class="overlay-modal__inner">
<span class="overlay-modal__close overlay-modal__trigger--close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span>
</span>
<div class="overlay-modal__content">
<h3 class="heading heading--4">
<span data-step="1">AlphaTheta Care NAME</span>
</h3>
<div class="overlay-modal__description">
<div class="form-container__info">
<h3 class="form-container__info--title">AlphaTheta Care Plus</h3>
<p class="form-container__info--text">NAME</p>
<br>
<h3 class="form-container__info--title">AlphaTheta Care Pro</h3>
<p class="form-container__info--text">NAME</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="overlay-modal" data-modal="atc-care">
<div class="overlay-modal__overlay">
<span class="overlay-modal__bg overlay-modal__trigger--close"></span>
<div class="overlay-modal__inner">
<span class="overlay-modal__close overlay-modal__trigger--close" onclick="clearText()">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span>
</span>
<div class="overlay-modal__content">
<h3 class="heading heading--4">
<span class="form-title" id="formTitle"></span>
</h3>
<br>
<form id="form-atccare" class="form-container" novalidate>
<div class="client">
<div class="client__type">
<div class="customer-field">
<input class="custom-radio" name="care" id="private" type="radio" value="private" checked onclick="validateAddtoCartbtn()">
<label id="private_client" for="private">
</label>
</div>
</div>
<div class="client__type">
<div class="customer-field">
<input class="custom-radio" name="care" id="business" type="radio" value="business" onclick="validateAddtoCartbtn()">
<label id="business_client" for="business">
</label>
</div>
</div>
</div>
<div class="overlay-modal__form">
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="firstname" id="name" value="" errorId="name_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">NAME</span>
</div>
<span id="name_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">Enter valid name</span>
</div>
<br>
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="surname" id="surname" value="" errorId="surname_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">NAME</span>
</div>
<span id="surname_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">
* Please enter the "Last Name".</span>
</div>
<br>
<div class="business-field hidden">
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="corporate" id="corporate_name" value="" disabled errorId="corporate_name_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">Corporate Name</span>
</div>
<span id="corporate_name_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">
* Please enter the "Last Name".</span>
</div>
<br>
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="club" id="club_name" value="" disabled errorId="club_name_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">ClubName</span>
</div>
<span id="club_name_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">
* Please enter the "Last Name".</span>
</div>
<br>
</div>
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="email" id="email" value="" errorId="email_error_txt" onfocusout="formValidation(this)">
<span class="input-field__placeholder">NAME</span>
</div>
<span id="email_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">email address error message</span>
<span id="email-format_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">email address format error message</span>
</div>
<br>
<div class="input-field">
<div class="input-field__inner">
<input class="input-field__info" type="text" name="confirm-email" value="" id="confirm-email" errorId="confirm-email_error_txt" onfocusout="formValidation(this)" onpaste="return false;" ondrop="return false;" autocomplete="off">
<span class="input-field__placeholder">NAME</span>
</div>
<span id="confirm-email_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">Enter your confirmation email address - error message</span>
<span id="confirm-email-match_error_txt" style="margin:.3em 0 0 0; color: #E63F5C;">Email Address Match - error message</span>
</div>
<br>
<div class="overlay-modal__note">
<div class="checkbox">
<label class="checkbox__inner">
<input class="input-field__info" type="checkbox" name="agree" value="agree" id="agree" onclick="validateAddtoCartbtn()">
<span class="checkbox__spoof">
<span class="checkbox__icon">
<svg class="icon-check" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 12">
<path fill="currentColor" d="M5.961 12L0 6.039l2.4-2.4L5.961 7.2 13.084 0l2.4 2.477L5.96 12z" />
</svg>
</span>
</span>
</label>
</div>
</div>
<div class="overlay-modal__action">
<a href="javascript:void(0)" class="action action--normal action--on-light btn-buy-now" id="btn_buynow" goal-id="{3EF4DC1F-C8B7-414A-A50B-2C3B3C993CF7}" data-sku="" data-variantsku="" data-pwwsku data-pwwvariantsku data-careprodname="DDJ-FLX10" data-planselected data-planprice data-modelnumber="DDJ-FLX10" data-culturecode="en" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Buy online', 'dlLabel': '', 'dlPosition': 'top', 'dlURL': 'javascript:void(0)'});buynow()">
<span class="action__bg"></span>
<span class="action__label">Buy Now</span>
</a>
<span style="font-size: 0.75rem;" id="annotationMsgOnAddToCart"> </span>
</div>
</div>
</form>
</div>
</div>
</div>
</section>
<div class="hero-product__actions actions actions--stack actions--force">
<div class="actions__item">
<a id="wheretobuy" href="/en/shops/search/#/{D7A7E2DF-B000-42C8-9533-543B93B3A203}/{E25E5942-A974-4675-ACEB-8C204EC8A445}" goal-id="{B4414F34-A71F-495A-83F6-CE4A7D041164}" class="action action--normal action--on-light" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Where to Buy', 'dlLabel': '', 'dlPosition': 'top', 'dlURL': '/en/shops/search/'});">
<span class="action__bg"></span>
<span class="action__label">Where to buy</span>
</a>
</div>
</div>
</div>
</div>
</div>
</section>
<script>
//Added - Dealer Locator - Passing ProductItem ID and its corresponding Product CategoryID to the query string
// var findastorevalue = jQuery('li.mainNav__item').children().last().attr('href');
// jQuery('li.mainNav__item').children().last().attr('href', findastorevalue + '#/' + $("#ProductCategoryID").val() + '/' + $("#ProductID").val());
var validMailId = false;
var validCaptcha = false;
function validateEmail($email) {
var emailReg = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
return emailReg.test($email);
}
function ClearErrors() {
$("#MailError").hide();
$("#CaptchaError").hide();
$("#MailExists").hide();
}
function registerbackorder(event) {
event.preventDefault();
ClearErrors();
var emailIDValue = $('[name=emailaddress]').val();
if (!validateEmail(emailIDValue)) {
$("#MailError").show();
validMailId = false;
} else { validMailId = true }
var ContextIDValue = $("#productCurrentItem").val();
var captcharesponse = grecaptcha.getResponse();
if (validMailId && (captcharesponse == null || captcharesponse == "")) {
$("#CaptchaError").show();
validCaptcha = false;
} else { validCaptcha = true }
if (validCaptcha && validMailId) {
jQuery.ajax({
type: "POST",
url: '/api/sitecore/BackOrder/Add',
data: JSON.stringify({ emailid: emailIDValue, contextItemId: ContextIDValue, CaptchaResponse: captcharesponse }),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
if (data.Success) {
//document.querySelector('.overlay-modal').setAttribute('data-step', 2); return false;
document.querySelectorAll(".overlay-modal").forEach(ele => {
if (ele.getAttribute("data-notificationmodal") == "notification-info")
ele.setAttribute('data-step', 2);
});
return false;
}
else {
if (data.FailureCode = "100") {
$("#MailExists").show();
}
}
},
//failure: function (response) {
// alert(response.responseText);
//},
error: function (response) {
alert(response.statusText);
}
});
}
}
function warrantySelection(data) {
var pwwsku = data.getAttribute('data-pwwsku');
var pwwvariantsku = data.getAttribute('data-pwwvariantsku');
var planSelected = data.getAttribute('data-planselected');
var planPrice = data.getAttribute('data-planprice');
var btn_buynow = document.querySelector('#btn_buynow');
if (btn_buynow != null) {
btn_buynow.setAttribute('data-pwwsku', pwwsku);
btn_buynow.setAttribute('data-pwwvariantsku', pwwvariantsku);
btn_buynow.setAttribute('data-planselected', planSelected);
btn_buynow.setAttribute('data-planprice', planPrice);
}
if (document.getElementById('care-plus') != null && document.getElementById('care-plus').checked) {
document.getElementById('formTitle').innerHTML = document.getElementById('care-plus').value;
}
else if (document.getElementById('care-pro') != null && document.getElementById('care-pro').checked) {
document.getElementById('formTitle').innerHTML = document.getElementById('care-pro').value;
}
ShowHideBuyNowBtn();
}
ShowHideBuyNowBtn();
function ShowHideBuyNowBtn() {
if (document.getElementById('btn_addtocart') != null)
document.getElementById('btn_addtocart').style.display = "none";
if (document.getElementById('btn_addtocartpww') != null)
document.getElementById('btn_addtocartpww').style.display = "none";
var element = document.getElementById('care-no');
if (typeof element !== "undefined" && element !== null) {
if (document.getElementById('care-no').checked && document.getElementById('btn_addtocartpww') != null) {
document.getElementById('btn_addtocartpww').style.display = "block";
}
else if (((document.getElementById('care-plus') != null && document.getElementById('care-plus').checked)
|| (document.getElementById('care-pro') != null && document.getElementById('care-pro').checked))
&& document.getElementById('btn_addtocart') != null) {
document.getElementById('btn_addtocart').style.display = "block";
}
}
else if (document.getElementById('btn_addtocartpww') != null) {
document.getElementById('btn_addtocartpww').style.display = "block";
}
}
function buynow() {
//get form details
var surname = jQuery('#surname').val();
var name = jQuery('#name').val();
var email = jQuery('#email').val();
var element = document.getElementById('ProductCategoryName');
if (typeof element !== "undefined" && element !== null) {
var productname = jQuery('#ProductCategoryName').val();
}
else {
var productname = document.getElementById('product_name').innerHTML;
}
if (document.getElementById('care-plus') != null && document.getElementById('care-plus').checked) {
var warrantytype = document.getElementById('care-plus').value;
}
else if (document.getElementById('care-pro') != null && document.getElementById('care-pro').checked) {
var warrantytype = document.getElementById('care-pro').value;
}
if (document.getElementById('private').checked) {
var userformtype = document.getElementById('private_client').innerHTML;
}
else if (document.getElementById('business').checked) {
var userformtype = document.getElementById('business_client').innerHTML;
}
var corporatename = jQuery('#corporate_name').val();
var clubname = jQuery('#club_name').val();
if (window.FormData == undefined)
alert("Error: FormData is undefined");
var fileData = new FormData();
//save formdetails to object
const object = {
Surname: surname,
Name: name,
Email: email,
CorporateName: corporatename,
ClubName: clubname,
WarrantyType: warrantytype,
UserFormType: userformtype,
ProductName: productname,
};
//append object details to filedata
for (var key in object) {
fileData.append(key, object[key]);
}
jQuery.ajax({
url: '/api/sitecore/Product/SaveUserFormDetails',
type: 'post',
datatype: 'json',
contentType: false,
processData: false,
async: false,
data: fileData,
success: function (response) {
console.log("Form Success");
}
});
}
function clearText() {
$('input[type=text]').each(function () {
$(this).val('');
});
document.querySelectorAll('div.input-field').forEach(function (ele) {
ele.classList.remove('has-value');
});
hideFormErrorMessage();
}
//Page reload for radio reset
window.addEventListener("pageshow", function (event) {
var historyTraversal = event.persisted || (typeof window.performance != "undefined" && window.performance.navigation.type === 2);
if (historyTraversal) {
window.location.reload();
}
});
//form validation
hideFormErrorMessage();
function hideFormErrorMessage() {
document.getElementById("name_error_txt").style.display = "none";
document.getElementById("surname_error_txt").style.display = "none";
document.getElementById("corporate_name_error_txt").style.display = "none";
document.getElementById("club_name_error_txt").style.display = "none";
document.getElementById("email_error_txt").style.display = "none";
document.getElementById("email-format_error_txt").style.display = "none";
document.getElementById("confirm-email_error_txt").style.display = "none";
document.getElementById("confirm-email-match_error_txt").style.display = "none";
var cultureCode = 'en';
if (cultureCode == "en-us") {
document.getElementById("streetaddress_error_txt").style.display = "none";
document.getElementById("city_error_txt").style.display = "none";
document.getElementById("zipcode_error_txt").style.display = "none";
document.getElementById("state_error_txt").style.display = "none";
document.getElementById("phone_error_txt").style.display = "none";
document.getElementById("phone-format_error_txt").style.display = "none";
}
document.getElementById("agree").checked = false;
document.querySelector("#btn_buynow").setAttribute("disabled", true)
document.getElementById("annotationMsgOnAddToCart").style.display = "none";
}
function formValidation(data) {
var elementId = data.attributes['id'].value;
var elementErrorId = data.attributes['errorId'].value;
switch (elementId) {
case "name":
case "surname":
case "corporate_name":
case "club_name":
case "streetaddress":
case "city":
case "zipcode":
case "state":
document.getElementById(elementErrorId).style.display = "none";
if (document.getElementById(elementId).value == "")
document.getElementById(elementErrorId).style.display = "block";
break;
case "phone":
document.getElementById(elementErrorId).style.display = "none";
document.getElementById("phone-format_error_txt").style.display = "none";
var regex = new RegExp(/\+?\d{0,3}[\s\(\-]?([0-9]{2,3})[\s\)\-]?([\s\-]?)([0-9]{3})[\s\-]?([0-9]{2})[\s\-]?([0-9]{2})/g);
var phoneValue = document.getElementById(elementId).value;
if (phoneValue == "")
document.getElementById(elementErrorId).style.display = "block";
else if (!regex.test(phoneValue))
document.getElementById("phone-format_error_txt").style.display = "block";
break;
case "email":
document.getElementById(elementErrorId).style.display = "none";
document.getElementById("email-format_error_txt").style.display = "none";
document.getElementById("confirm-email-match_error_txt").style.display = "none";
if (document.getElementById(elementId).value == "") {
document.getElementById(elementErrorId).style.display = "block";
}
else if (!validateEmail(document.getElementById(elementId).value)) {
document.getElementById("email-format_error_txt").style.display = "block";
}
else if (!validateEmailId(document.getElementById(elementId).value, document.getElementById("confirm-email").value)) {
document.getElementById("confirm-email-match_error_txt").style.display = "block";
}
break;
case "confirm-email":
document.getElementById(elementErrorId).style.display = "none";
document.getElementById("confirm-email-match_error_txt").style.display = "none";
if (document.getElementById(elementId).value == "") {
document.getElementById(elementErrorId).style.display = "block";
}
else if (!validateConfirmEmailId(document.getElementById(elementId).value, document.getElementById("email").value)) {
document.getElementById("confirm-email-match_error_txt").style.display = "block";
}
break;
}
validateAddtoCartbtn();
}
function validateEmailId(email1, email2) {
if (email1 != "" && email2 == "") {
return true;
}
else {
return validateConfirmEmailId(email1, email2)
}
return false;
}
function validateConfirmEmailId(email1, email2) {
if (email1 != "" && email2 != "") {
if (email1 == email2)
return true;
}
return false;
}
function validateAddtoCartbtn() {
document.querySelector("#btn_buynow").setAttribute("disabled", true)
document.getElementById("annotationMsgOnAddToCart").style.display = "none";
if ((document.getElementById("name").value != "" && document.getElementById("name_error_txt").style.display == "none")
&& (document.getElementById("surname").value != "" && document.getElementById("surname_error_txt").style.display == "none")
&& (document.getElementById("email").value != ""
&& document.getElementById("email_error_txt").style.display == "none"
&& document.getElementById("email-format_error_txt").style.display == "none")
&& (document.getElementById("confirm-email").value != ""
&& document.getElementById("confirm-email_error_txt").style.display == "none"
&& document.getElementById("confirm-email-match_error_txt").style.display == "none")
&& document.getElementById("agree").checked == true) {
var cultureCode = 'en';
if (cultureCode == "en-us") {
if ((document.getElementById("streetaddress").value != "" && document.getElementById("streetaddress_error_txt").style.display == "none")
&& (document.getElementById("city").value != "" && document.getElementById("city_error_txt").style.display == "none")
&& (document.getElementById("zipcode").value != "" && document.getElementById("zipcode_error_txt").style.display == "none")
&& (document.getElementById("state").value != "" && document.getElementById("state_error_txt").style.display == "none")
&& (document.getElementById("phone").value != ""
&& document.getElementById("phone_error_txt").style.display == "none"
&& document.getElementById("phone-format_error_txt").style.display == "none")) {
setRequiredAttributes();
}
}
else {
setRequiredAttributes();
}
}
}
function setRequiredAttributes() {
if (document.getElementById("business").checked == true) {
if ((document.getElementById("corporate_name").value != "" && document.getElementById("corporate_name_error_txt").style.display == "none")
&& (document.getElementById("club_name").value != "" && document.getElementById("club_name_error_txt").style.display == "none")) {
document.querySelector("#btn_buynow").setAttribute("disabled", false)
document.getElementById("annotationMsgOnAddToCart").style.display = "block";
}
}
else {
document.querySelector("#btn_buynow").setAttribute("disabled", false)
document.getElementById("annotationMsgOnAddToCart").style.display = "block";
}
}
disableEmail();
function disableEmail() {
var cultureCode = 'en';
if (cultureCode == "en-us") {
var email = '';
var emailElement = document.getElementById("email");
var confirmEmailElement = document.getElementById("confirm-email");
if (email != "") {
emailElement.value = email;
emailElement.disabled = true;
confirmEmailElement.value = email;
confirmEmailElement.disabled = true;
}
else {
emailElement.value = "";
emailElement.disabled = false;
confirmEmailElement.value = "";
confirmEmailElement.disabled = false;
}
}
}
</script>
<div class="nav-in-page-v2 nav-in-page-v2--top-spacing">
<div class="nav-in-page-v2 nav-in-page-v2--medium">
<span class="nav-in-page-v2__anchor"></span>
<div class="nav-in-page-v2__inner">
<a class="nav-in-page-v2__label">
<span class="link__label">Overview</span>
<div class="link__icon">
<svg class="icon-chevron" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<path fill="currentColor" d="M11.172 9.82L13 8 9.906 4.99 6.04 1.21c-.281-.28-.703-.28-.914 0l-.914.91c-.281.28-.281.7 0 .91L9.273 8l-5.062 4.97c-.281.28-.281.7 0 .91l.914.91c.281.28.703.28.914 0l5.133-4.97z"></path>
</svg>
</div>
</a>
<nav class="nav-in-page-v2__nav">
<ul class="nav-in-page-v2__nav-items">
<li class="nav-in-page-v2__nav-item active">
<a href="/en/product/controller/ddj-flx10/black/overview/#the-bucket" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Overview', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/overview/#the-bucket' });">
<span class="link__label">Overview</span>
</a>
</li>
<li class="nav-in-page-v2__nav-item">
<a href="/en/product/controller/ddj-flx10/black/specifications/" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Specifications', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/specifications/' });">
<span class="link__label">Specifications</span>
</a>
</li>
<li class="nav-in-page-v2__nav-item">
<a href="/en/product/controller/ddj-flx10/black/support/" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Support', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/support/' });">
<span class="link__label">Support</span>
</a>
</li>
</ul>
</nav>
<div class="nav-in-page-v2__actions">
<div class="nav-in-page-v2__actions-inner">
<a id="wheretobuy" href="/en/shops/search/" goal-id="{B4414F34-A71F-495A-83F6-CE4A7D041164}" class="link link--colored" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Floating where to buy', 'dlLabel': 'Black', 'dlPosition': '', 'dlURL': '/en/shops/search/' });">
<span class="link__label">Where to buy</span>
</a>
<a id="wheretobuy" href="/en/shops/search/" goal-id="{B4414F34-A71F-495A-83F6-CE4A7D041164}" class="action action--normal action--on-light" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Floating where to buy', 'dlLabel': 'Black', 'dlPosition': '', 'dlURL': '/en/shops/search/' });">
<span class="action__bg"></span>
<span class="action__label">Where to buy</span>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="nav-in-page-v2 nav-in-page-v2--small hidden">
<span class="nav-in-page-v2__anchor"></span>
<div class="nav-in-page-v2__inner">
<nav class="nav-in-page-v2__inner__nav">
<ul class="nav-in-page-v2__inner__nav-items">
<li class="nav-in-page-v2__nav-item active">
<a href="/en/product/controller/ddj-flx10/black/overview/#the-bucket" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Overview', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/overview/#the-bucket' });">
<span class="link__label">Overview</span>
</a>
</li>
<li class="nav-in-page-v2__nav-item">
<a href="/en/product/controller/ddj-flx10/black/specifications/" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Specifications', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/specifications/' });">
<span class="link__label">Specifications</span>
</a>
</li>
<li class="nav-in-page-v2__nav-item">
<a href="/en/product/controller/ddj-flx10/black/support/" class="nav-in-page-v2__link" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Navigation', 'dlLabel': 'Support', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/support/' });">
<span class="link__label">Support</span>
</a>
</li>
</ul>
</nav>
</div>
</div>
<style type="text/css">
@media screen and (max-width: 768px) {
.nav-in-page-v2--is-scroll .nav-in-page-v2__nav .nav-in-page-v2__link {
color: var(--color--neutrals-10);
}
.nav-top-page__link {
color: var(--color--neutrals-10);
}
}
</style>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function () {
const navInPageV2 = document.querySelector('.nav-in-page-v2');
const navTopPage = document.querySelector('.nav-top-page');
const heroProduct = document.querySelector('.hero-product');
if (navInPageV2 && navTopPage) {
if (heroProduct) {
navTopPage.parentNode.removeChild(navTopPage);
} else {
navInPageV2.parentNode.removeChild(navInPageV2);
navTopPage.classList.remove('hidden');
}
}
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content section--9 col-xs-12">
<div class="component-content" id='Video player'>
<section class="media media--contained"><div class="media__inner"><div class="video-player"><picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj_flx_10_video_thumbnail_1920x1080.jpg">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj_flx_10_video_thumbnail_1920x1080.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj_flx_10_video_thumbnail_1920x1080.jpg" alt="">
</picture>
<a class="video-player__trigger">
<span class="video-ID">N0dg3GNnoRw</span>
<span class="video-url" ></span>
<span class="icon-play">
<span class="icon-play__inner"></span>
<span class="icon-play__icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z" />
</svg>
</span>
</span> </a></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12" id="seeallvideos">
<div class="component-content" id='default-text'>
<section class="col-one"><div class="col-one__inner"><div class="col-one__content field-text">KEY FEATURES</div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12">
<div class="component-content" id='Content1'>
<section><div class="col-two__inner"><div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content1'>
<div class="col-two__visual"><div class="video-player"><div class="video-bg">
<video autoplay loop="" muted="" playsinline="" poster="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_1_pc.jpg" src="/-/media/PioneerDj/Images/Features/Controller/DDJ-FLX10/KEY_FEATURE_IMAGE001_TRACK_SEPARATION_1053x1053.mp4"></video>
<a class="video-bg__control video-bg__control--right">
<span class="icon-media">
<span class="icon-media__inner">
<span class="icon-media__pause">
<svg class="icon-media__play" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z"></path>
</svg>
</span>
</span>
</span>
</a>
</div>
</div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div><div class="col-two__item"><div class="col-two__content"><h2 class="col-two__heading heading heading--5 field-promotext">Track Separation for innovative performances including live mashups</h2><div class="col-two__item__description field-promotext2"><p>Load the regular songs from your music library and create remixes and mash-ups on the fly by independently manipulating the 3 key parts of the music: vocals, drums, and inst (other instruments including bass and synths). There are dedicated color-coded buttons to control each part, so you’ll always have a clear visual grasp of what’s playing.</p>
<ul class="list-rotary">
<li>ACTIVE PART & PART ISO<br />
<small>Individually adjust the volume for the vocals, drums, or inst, or mute them completely.</small></li>
<li>FX PART SELECT<br />
<small>Choose which parts of a track you want to apply effects to.</small></li>
<li>PART INSTANT DOUBLES <br />
<small>Isolate a specific part of the track (vocal, drums, or inst) and transfer it to another deck.</small></li>
</ul></div><div class="gap--s--top-out-2"></div><div class="gap--s--top-out-4"></div></div></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12" id="TutorialVideos">
<div class="component-content" id='default-text'>
<section class="col-one"><div class="col-one__inner"><div class="col-one__content field-text"><div class="spacer spacer--3" id="trackseparation"></div>
<h2 class="section-header__heading heading heading--4" style="font-size: var(--h--6; font-weight: bold; text-align: center; text-transform: none;">See details of the Track Separation function</h2>
<div class="spacer spacer--5"></div>
<a rel="noopener noreferrer" href="https://rekordbox.com/en/recommend/livemashup/" target="_blank">
<img alt="Track Separation function detail" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/flx10_track-separation_banner.jpg" class="img-responsive lazyload" />
</a>
<br />
<br />
<br /></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12 col-two--reversed">
<div class="component-content" id='Content2'>
<section><div class="col-two__inner"><div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content2'>
<div class="col-two__visual"><div><picture class="visual">
<source media="(max-width: 748px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_2_sp.jpg">
<source media="(min-width: 751px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_2_pc.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_2_pc.jpg" alt="">
</picture></div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div><div class="col-two__item"><div class="col-two__content"><h2 class="col-two__heading heading heading--5 field-promotext">Expanded On Jog Display</h2><div class="col-two__item__description field-promotext2"><p>Customize the information you see on the jogs so there’s no need to take your eyes off the decks. Choose from 4 modes, some of which show 3 Band Waveforms (rekordbox only), and keep an eye on Mix Point Link and rekordbox vocal position analysis information, as well as Performance Pad status. </p>
<ul class="list-rotary">
<li>DECK INFO MODE<br />
<small>Shows the information about the deck, including the Overall Waveform. (When using Serato DJ Pro, this mode shows the virtual deck of Serato DJ Pro.)</small></li>
<li>WAVEFORM MODE<br />
<small>Shows the Zoomed Waveforms for 2 decks.</small></li>
<li>ARTWORK DISPLAY<br />
<small>Shows the artwork for the track that’s playing.</small></li>
<li>DJ LOGO DISPLAY<br />
<small>Shows your own logo or favorite image on each deck after using the Image Transfer Tool for PC/Mac.</small> </li>
</ul></div><div class="gap--s--top-out-2"></div><div class="gap--s--top-out-4"></div></div></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12">
<div class="component-content" id='Content3'>
<section><div class="col-two__inner"><div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content3'>
<div class="col-two__visual"><div class="video-player"><div class="video-bg">
<video autoplay loop="" muted="" playsinline="" poster="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_3_pc.jpg" src="/-/media/PioneerDj/Images/Features/Controller/DDJ-FLX10/KEY_FEATURE_IMAGE002_MIX_POINT_LINK_1053x1053.mp4"></video>
<a class="video-bg__control video-bg__control--right">
<span class="icon-media">
<span class="icon-media__inner">
<span class="icon-media__pause">
<svg class="icon-media__play" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z"></path>
</svg>
</span>
</span>
</span>
</a>
</div>
</div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div><div class="col-two__item"><div class="col-two__content"><h2 class="col-two__heading heading heading--5 field-promotext">New Mix Point Link for seamless transitions</h2><div class="col-two__item__description field-promotext2"><p>Take advantage of a completely new playback concept in rekordbox that enables you to create slick musical progression in your sets by linking mix points in tracks so the next song kicks in at the perfect moment. You might set the next track to start from the beginning of its melody when the vocal of the current song ends, ensuring a seamless transition without a sound clash. There’s no need to count down or press play manually, which also leaves your hands free to create mash-ups or add effects.</p></div><div class="gap--s--top-out-2"></div><div class="gap--s--top-out-4"></div></div></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12 col-two--reversed">
<div class="component-content" id='Content4'>
<section><div class="col-two__inner"><div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content4'>
<div class="col-two__visual"><div class="video-player"><div class="video-bg">
<video autoplay loop="" muted="" playsinline="" poster="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_4_pc.jpg" src="/-/media/PioneerDj/Images/Features/Controller/DDJ-FLX10/KEY_FEATURE_IMAGE003_rekordboxLIGHTING_1053x1053.mp4"></video>
<a class="video-bg__control video-bg__control--right">
<span class="icon-media">
<span class="icon-media__inner">
<span class="icon-media__pause">
<svg class="icon-media__play" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z"></path>
</svg>
</span>
</span>
</span>
</a>
</div>
</div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div><div class="col-two__item"><div class="col-two__content"><h2 class="col-two__heading heading heading--5 field-promotext">DMX output for rekordbox Lighting function</h2><div class="col-two__item__description field-promotext2"><p>Liven up your performances with lighting effects that match the mood of the tracks you play. It’s easy with the rekordbox Lighting function and, thanks to the DMX output on the DDJ-FLX10, you don’t need any other equipment such as an external DMX interface. Simply connect DMX-compatible lighting equipment to the controller and use rekordbox to create custom lighting effects, or set the software to automatically adapt the color and movement of the lights to progress with the music.</p></div><div class="gap--s--top-out-2"></div><div class="gap--s--top-out-4"></div></div></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12">
<div class="component-content" id='Content5'>
<section><div class="col-two__inner"><div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content5'>
<div class="col-two__visual"><div><picture class="visual">
<source media="(max-width: 748px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_5_sp.jpg">
<source media="(min-width: 751px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_5_pc.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_5_pc.jpg" alt="">
</picture></div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div><div class="col-two__item"><div class="col-two__content"><h2 class="col-two__heading heading heading--5 field-promotext">Evolved MAGVEL FADER 4-sensor system</h2><div class="col-two__item__description field-promotext2"><p>Improved from the 2-sensor system on the DDJ-1000, the MAGVEL FADER on the DDJ-FLX10 uses a 4-sensor system. This allows you to make the tiniest volume adjustments, no matter how small the movement of the crossfader, enabling more musical performances. </p></div><div class="gap--s--top-out-2"></div><div class="gap--s--top-out-4"></div></div></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12 col-two--reversed">
<div class="component-content" id='Content6'>
<section><div class="col-two__inner"><div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content6'>
<div class="col-two__visual"><div><picture class="visual">
<source media="(max-width: 748px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_6_sp.jpg">
<source media="(min-width: 751px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_6_pc.jpg">
<img class="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_6_pc.jpg" alt="">
</picture></div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div><div class="col-two__item"><div class="col-two__content"><h2 class="col-two__heading heading heading--5 field-promotext">rekordbox and Serato DJ Pro compatibility</h2><div class="col-two__item__description field-promotext2"><p>The DDJ-FLX10 offers free plug-and-play compatibility with rekordbox and Serato DJ Pro, giving you hands-on control of your favorite software application. DVS support is available for rekordbox via selected subscription plans, and for Serato via a paid license/subscription to Serato DJ Expansions or Serato DJ Suite. </p></div><div class="gap--s--top-out-2"></div><div class="gap--s--top-out-4"></div></div></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-two col-xs-12">
<div class="component-content" id='Content7'>
<section><div class="col-two__inner"><div class="col-two__item section-divide-video">
<div class="component content col-xs-12">
<div class="component-content" id='Content7'>
<div class="col-two__visual"><div class="video-player"><div class="video-bg">
<video autoplay loop="" muted="" playsinline="" poster="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_2col-key-feature_7_pc.jpg" src="/-/media/PioneerDj/Images/Features/Controller/DDJ-FLX10/KEY_FEATURE_IMAGE004_MULTICOLOR_JOG_1053x1053.mp4"></video>
<a class="video-bg__control video-bg__control--right">
<span class="icon-media">
<span class="icon-media__inner">
<span class="icon-media__pause">
<svg class="icon-media__play" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 7.6 14">
<path fill="currentColor" d="M7.4,6.3l-5.6-6c-0.4-0.4-1-0.4-1.4,0C0.1,0.5,0,0.7,0,1v12c0,0.6,0.4,1,1,1c0.3,0,0.5-0.1,0.7-0.3l5.6-6C7.7,7.3,7.7,6.7,7.4,6.3z"></path>
</svg>
</span>
</span>
</span>
</a>
</div>
</div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div><div class="col-two__item"><div class="col-two__content"><h2 class="col-two__heading heading heading--5 field-promotext">Multicolored jog ring</h2><div class="col-two__item__description field-promotext2"><p>You can use the first-ever multicolored jog ring on a Pioneer DJ controller to indicate the different parts of the track that are playing when you’re using the Track Separation features, or you can customize the colors to your preferred look. </p></div><div class="gap--s--top-out-2"></div><div class="gap--s--top-out-4"></div></div></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12">
<div class="component-content" id='default-text'>
<section class="col-one"><div class="col-one__inner"><div class="col-one__content field-text">OTHER FEATURES</div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--1"></div>
<div class="component content">
<div class="component-content" id='Overview'>
<div class="usp-small usp-small--col-two"><div class="usp-small__inner"><div class="usp-small__items">
<div class="component content usp-small__item">
<div class="component-content" id='Feature1'>
<div class="usp-snippet usp-snippet--C"><div class="usp-snippet__visual"><picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_web_small-feature_usb-type-c_1000x1000.png">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_web_small-feature_usb-type-c_1000x1000.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_web_small-feature_usb-type-c_1000x1000.png" alt="">
</picture></div><div class="usp-snippet__content"><h4 class="usp-snippet__title heading heading--7 field-promotext"><strong>USB Type-C</strong></h4><p class="usp-snippet__text p--2 field-promotext2">Connect your PC/Mac directly to the controller’s USB Type-C terminal with a single cable.</p></div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content usp-small__item">
<div class="component-content" id='Feature2'>
<div class="usp-snippet usp-snippet--C"><div class="usp-snippet__visual"><picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/mixer/djm-s11/small-serato-pnt-dj-icon.jpg">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/mixer/djm-s11/small-serato-pnt-dj-icon.jpg">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/mixer/djm-s11/small-serato-pnt-dj-icon.jpg" alt="">
</picture></div><div class="usp-snippet__content"><h4 class="usp-snippet__title heading heading--7 field-promotext"><strong>Pitch 'n Time DJ</strong></h4><p class="usp-snippet__text p--2 field-promotext2">A voucher for the Serato Pitch ‘n Time DJ Expansion Pack is included, which enables key shifting and key syncing with perfect audio quality.</p></div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content usp-small__item">
<div class="component-content" id='Feature3'>
<div class="usp-snippet usp-snippet--C"><div class="usp-snippet__visual"><picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/performance-pads.jpg">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/performance-pads.jpg">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/performance-pads.jpg" alt="">
</picture></div><div class="usp-snippet__content"><h4 class="usp-snippet__title heading heading--7 field-promotext"><strong>Performance Pads</strong></h4><p class="usp-snippet__text p--2 field-promotext2">Hit the 8 back-lit rubber Performance Pads to trigger Hot Cues, Pad FX, Beat Jump, and the sampler.</p></div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content usp-small__item">
<div class="component-content" id='Feature5'>
<div class="usp-snippet usp-snippet--C"><div class="usp-snippet__visual"><picture class="visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/landing/firmware-update-manager/d_w_1043.jpg">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/landing/firmware-update-manager/d_w_1043.jpg">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/landing/firmware-update-manager/d_w_1043.jpg" alt="">
</picture></div><div class="usp-snippet__content"><h4 class="usp-snippet__title heading heading--7 field-promotext"><strong>Firmware Update Manager</strong></h4><p class="usp-snippet__text p--2 field-promotext2">You’ll be automatically notified when firmware updates become available. You can download the Firmware Update Manager <a href="/en/landing/firmware-update-manager/">here</a>.</p></div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div></div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--15"></div>
<div class="component content section--9 col-xs-12">
<div class="component-content" id='Common'>
<section class="hotspots"><div class="hotspots__inner"><div class="hotspots__content"><div><picture class="hotspots__visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_top_1.png">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_top_1.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_top_1.png" alt="">
</picture></div><div class="hotspots__spots">
<div class="component content col-xs-12">
<div class="component-content" id='hotspot1'>
<div><a class="hotspot" style="top: 84%; left: 14%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot1.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot1.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">Performance Pads</span>
<span class="hotspot__description caption">Call up and control the Hot Cues, Pad FX, Beat Jump, and sampler.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot2'>
<div><a class="hotspot" style="top: 5%; left: 31.5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot2.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot2.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">Call Cue/ Loop section</span>
<span class="hotspot__description caption">Calls the memory cues and loops already set for the track.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot3'>
<div><a class="hotspot" style="top: 6%; left: 7%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot3.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot3.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">ACTIVE PART</span>
<span class="hotspot__description caption">Turns mute on/off for the drums, vocal, and inst parts. You can change the function from mute to solo via the settings in rekordbox.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot4'>
<div><a class="hotspot" style="top: 67%; left: 95%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot4.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot4.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">Beat FX section</span>
<span class="hotspot__description caption">A Beat FX section with the same feel as the DJM Series.
A new effect, Stretch, creates the sound of the audio stretching.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot5'>
<div><a class="hotspot" style="top: 50%; left: 92.5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot5.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot5.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">FX PART SELECT</span>
<span class="hotspot__description caption">Select a part to be applied with an effect when using Beat FX or Sound Color FX. The effect applies to the parts which are lit.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot6'>
<div><a class="hotspot" style="top: 17%; left: 31.5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot6.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot6.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">MIX POINT LINK</span>
<span class="hotspot__description caption">You can use this function to mix to your next track easily by setting the start and end points on the track for On Air.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot7'>
<div><a class="hotspot" style="top: 55%; left: 74%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot7.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot7.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">PART ISO switch</span>
<span class="hotspot__description caption">Individually adjust the volume for the vocals, drums, or inst.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot8'>
<div><a class="hotspot" style="top: 45%; left: 25%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot8.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot8.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">ON JOG DISPLAY</span>
<span class="hotspot__description caption">As well as switching between 4 different modes that can display waveforms and artwork, it can display various parameters from rekordbox to help with your performance.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot9'>
<div><a class="hotspot" style="top: 89%; left: 73.5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot9.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot9.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">MAGVEL FADER</span>
<span class="hotspot__description caption">The DDJ-FLX10 is the first controller in our lineup to include a 4-sensor MAGVEL FADER. This enables you to adjust the volume more precisely.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content col-xs-12">
<div class="component-content" id='hotspot10'>
<div><a class="hotspot" style="top: 38%; left: 42%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot10.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot10.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">MULTICOLOR JOG RING</span>
<span class="hotspot__description caption">The jog rings change in color to match the Active Part function or the color set by you.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='hotspot11'>
<div><a class="hotspot" style="top: 76%; left: 43%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot11.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot11.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">TEMPO RESET button</span>
<span class="hotspot__description caption">Turning the button on resets the BPM of the track to its original tempo.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='hotspot12'>
<div><a class="hotspot" style="top: 68%; left: 5%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__visual">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot12.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/hotspot12.png" alt="">
</picture>
</span>
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">BEAT JUMP button</span>
<span class="hotspot__description caption">By pressing the [BEAT JUMP] button, you can instantly move the playback position while keeping the beat of the track in time.
You can move 4 beats or 16 beats if you press [SHIFT].</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--3"></div>
<div class="component content section--9 col-xs-12">
<div class="component-content" id='Common 2'>
<section class="hotspots"><div class="hotspots__inner"><div class="hotspots__content"><div><picture class="hotspots__visual">
<source media="(max-width: 749px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_rear_1.png">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_rear_1.png">
<img src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_hotspot_rear_1.png" alt="">
</picture></div><div class="hotspots__spots">
<div class="component content col-xs-12">
<div class="component-content" id='hotspot-rear3'>
<div><a class="hotspot" style="top: 66%; left: 62%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">DMX Output Terminal</span>
<span class="hotspot__description caption">The DMX terminal is compatible with rekordbox Lighting mode.
By connecting your lighting equipment, the color and brightness of the lights will automatically change to match the music.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='hotspot-rear5'>
<div><a class="hotspot" style="top: 65%;left: 71%;" aria-expanded="false">
<span class="hotspot__trigger">
<span class="hotspot__trigger__inner">
<span class="hotspot__symbol">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span> </span>
</span>
</span>
<span class="hotspot__bubble">
<span class="hotspot__content">
<span class="hotspot__close">
<span class="icon-cross">
<span class="icon-cross__inner"></span>
</span> </span>
<span class="hotspot__title p--2">USB port (Type C)</span>
<span class="hotspot__description caption">Connection for a PC/Mac.</span>
</span>
</span>
</a></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12" id="TutorialVideos">
<div class="component-content" id='default-text'>
<section class="col-one"><div class="col-one__inner"><div class="col-one__content field-text"><div class="spacer spacer--15" id="spec"></div>
<h2 class="section-header__heading heading heading--4" style="font-size: var(--h--4); font-weight: bold; text-align: center;">SPECIFICATIONS</h2></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--0"></div>
<div class="component content spec-scroll">
<div class="component-content" id='Overview'>
<div class="specs"><div class="specs__inner"><div class="specs__table"><div class="table">
<div class="component content">
<div class="component-content" id='Row1'>
<div class="table__row"><div class="table__cell"><strong class="field-promotext">Width</strong></div><div class="table__cell field-promotext2">716 mm</div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='Row2'>
<div class="table__row"><div class="table__cell"><strong class="field-promotext">Height</strong></div><div class="table__cell field-promotext2">73.4 mm</div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='Row3'>
<div class="table__row"><div class="table__cell"><strong class="field-promotext">Depth</strong></div><div class="table__cell field-promotext2">400.3 mm</div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="component content">
<div class="component-content" id='Row4'>
<div class="table__row"><div class="table__cell"><strong class="field-promotext">Weight</strong></div><div class="table__cell field-promotext2">6.7 kg</div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="specs__actions actions actions--start actions--m--end actions--force">
<div class="actions__item">
<a href="/en/landing/comparison/dj-controller/" class="link link--underlined">
<span class="link__label">Compare</span>
</a>
</div>
<div class="actions__item">
<a href="/en/product/controller/ddj-flx10/black/specifications/" class="action action--normal action--on-light" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'See all specs', 'dlLabel': '', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx10/black/specifications/'});">
<span class="action__bg"></span>
<span class="action__label">See all specs</span>
</a>
</div>
</div>
</div></div></div></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--20"></div>
<section class="media media--grid">
<div class="media__in">
<div class="media__inner">
<div class="media__content">
<div class="media__item">
<div class="media__item__inner">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_1.jpg">
<img class ="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_1.jpg" alt="">
</picture>
</div>
</div>
<div class="media__item">
<div class="media__item__inner">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_2.jpg">
<img class ="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_2.jpg" alt="">
</picture>
</div>
</div>
<div class="media__item">
<div class="media__item__inner">
<picture class="visual">
<source media="(min-width: 750px)" srcset="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_3.jpg">
<img class ="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/features/controller/ddj-flx10/ddj-flx10_setup_3.jpg" alt="">
</picture>
</div>
</div>
</div>
</div>
<div class="media__loadmore">
<a href="/api/sitecore/Product/GenerateJson?ItemId=a3f92fdd-27b2-4af5-9f87-269d6e706d20&page=" class="loadmore" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Load more', 'dlLabel': 'Images', 'dlPosition': '', 'dlURL': ''});">
<span class="loadmore__icon">
<span class="icon-plus">
<span class="icon-plus__inner"></span>
</span>
</span>
<span class="loadmore__label p--1">load more media</span>
</a>
</div>
</div>
</section>
<div class="spacer spacer--20"></div>
<div class="combine-with combine-with--tabs">
<div class="combine-with__in">
<div class="combine-with__header">
<div class="combine-with__labels swiper-container">
<div class="swiper-wrapper">
<div class="combine-with__label swiper-slide">OTHER CONTROLLERS</div>
<div class="combine-with__label swiper-slide">COMBINE WITH</div>
</div>
</div>
</div>
<div class="combine-with__main swiper-container">
<div class="swiper-wrapper">
<div class="combine-with__item swiper-slide">
<div class="combine-with__carousel">
<section class="carousel swiper-container">
<div class="swiper-wrapper">
<!--carousel-->
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/controller/ddj-flx6-gt/graphite/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DDJ-FLX6-GT', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx6-gt/graphite/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class ="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx6-gt/pc-cgi_top.png?h=250&w=400&hash=C13FB1BDF9EDBFA4284CD8D105D763C8" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/controller/ddj-flx6-gt/graphite/overview/" class="link link--default">
<span class="link__label">DDJ-FLX6-GT</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
4-channel DJ controller for multiple DJ applications
</div>
</div>
<!--Buynow-->
</article>
</div>
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/controller/ddj-flx4/black/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DDJ-FLX4', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-flx4/black/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class ="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-flx4/pc-cgi_top.png?h=250&w=400&hash=512BD81B4009070AC985887FC3599CF1" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/controller/ddj-flx4/black/overview/" class="link link--default">
<span class="link__label">DDJ-FLX4</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
2-channel DJ controller for multiple DJ applications
</div>
</div>
<!--Buynow-->
</article>
</div>
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/controller/ddj-rev1/black/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DDJ-REV1', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-rev1/black/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class ="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-rev1/ddj-rev1_prm_top_1792x1316_pc.png?h=250&w=400&hash=12A3ED7B0F78CFF69709E28C714B8990" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/controller/ddj-rev1/black/overview/" class="link link--default">
<span class="link__label">DDJ-REV1</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
Scratch-style 2-channel DJ controller for Serato DJ Lite
</div>
</div>
<!--Buynow-->
</article>
</div>
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/controller/ddj-rev7/black/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DDJ-REV7', 'dlPosition': '', 'dlURL': '/en/product/controller/ddj-rev7/black/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class ="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/controller/ddj-rev7/at-care_category_ddj-rev7-2_1792x1316b.png?h=250&w=400&hash=579D1596F95E0BDF12A07C4980F45FCE" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/controller/ddj-rev7/black/overview/" class="link link--default">
<span class="link__label">DDJ-REV7</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
Scratch-style 2-channel professional DJ controller for Serato DJ Pro
</div>
</div>
<!--Buynow-->
</article>
</div>
</div>
<nav class="carousel__nav">
<div class="carousel__nav__item">
<a class="carousel__nav__link carousel__nav__link--prev" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Related products', 'dlLabel': 'Left', 'dlPosition': '', 'dlURL': ''});">
<span class="carousel__nav__icon">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 9.7 16">
<path fill="currentColor" d="M0.4,0.4C0.8-0.1,1.5-0.1,2,0.3L2,0.4L9.7,8L2,15.6c-0.5,0.5-1.2,0.5-1.7,0c-0.4-0.4-0.5-1.1-0.1-1.6l0.1-0.1L6.3,8L0.4,2C-0.1,1.6-0.1,0.9,0.4,0.4L0.4,0.4z" />
</svg>
</span>
</a>
</div>
<div class="carousel__nav__item">
<a class="carousel__nav__link carousel__nav__link--next" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Related products', 'dlLabel': 'Right', 'dlPosition': '', 'dlURL': ''});">
<span class="carousel__nav__icon">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 9.7 16">
<path fill="currentColor" d="M0.4,0.4C0.8-0.1,1.5-0.1,2,0.3L2,0.4L9.7,8L2,15.6c-0.5,0.5-1.2,0.5-1.7,0c-0.4-0.4-0.5-1.1-0.1-1.6l0.1-0.1L6.3,8L0.4,2C-0.1,1.6-0.1,0.9,0.4,0.4L0.4,0.4z" />
</svg>
</span>
</a>
</div>
</nav>
</section>
</div>
</div>
<div class="combine-with__item swiper-slide">
<div class="combine-with__carousel">
<section class="carousel swiper-container">
<div class="swiper-wrapper">
<!--carousel-->
<div class="carousel__slide swiper-slide">
<article class="product-snippet">
<a href="/en/product/accessories/djc-flx10-bag/black/overview/" class="product-snippet__visual" onclick="dataLayer.push({ 'event': 'dlDYNAMICCOMPONENTSEvent', 'dlCategory': 'Dynamic component interaction', 'dlAction': 'Click', 'dlElement': 'Related products', 'dlLabel': 'DJC-FLX10 BAG', 'dlPosition': '', 'dlURL': '/en/product/accessories/djc-flx10-bag/black/overview/' });">
<div class="product-snippet__image">
<picture class="visual">
<img class ="lazyload" src="https://preprod.pioneerdj.com/-/media/pioneerdj/images/products/accessories/djc-flx10-bag/flx-10-case_closed2.png?h=250&w=400&hash=AB8E52D3046F31C3DF267F44248C0DFA" alt="">
</picture>
</div>
</a>
<div class="product-snippet__content">
<h4 class="product-snippet__heading heading">
<a href="/en/product/accessories/djc-flx10-bag/black/overview/" class="link link--default">
<span class="link__label">DJC-FLX10 BAG</span>
</a>
</h4>
<span class="product-snippet__price">
</span>
<div class="product-snippet__description">
DJ controller bag for the DDJ-FLX10
</div>
</div>
<!--Buynow-->
</article>
</div>
</div>
<nav class="carousel__nav">
<div class="carousel__nav__item">
<a class="carousel__nav__link carousel__nav__link--prev" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Related products', 'dlLabel': 'Left', 'dlPosition': '', 'dlURL': ''});">
<span class="carousel__nav__icon">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 9.7 16">
<path fill="currentColor" d="M0.4,0.4C0.8-0.1,1.5-0.1,2,0.3L2,0.4L9.7,8L2,15.6c-0.5,0.5-1.2,0.5-1.7,0c-0.4-0.4-0.5-1.1-0.1-1.6l0.1-0.1L6.3,8L0.4,2C-0.1,1.6-0.1,0.9,0.4,0.4L0.4,0.4z" />
</svg>
</span>
</a>
</div>
<div class="carousel__nav__item">
<a class="carousel__nav__link carousel__nav__link--next" onclick="dataLayer.push({'event':'dlDYNAMICCOMPONENTSEvent', 'dlCategory':'Dynamic component interaction', 'dlAction': 'Navigate', 'dlElement': 'Related products', 'dlLabel': 'Right', 'dlPosition': '', 'dlURL': ''});">
<span class="carousel__nav__icon">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 9.7 16">
<path fill="currentColor" d="M0.4,0.4C0.8-0.1,1.5-0.1,2,0.3L2,0.4L9.7,8L2,15.6c-0.5,0.5-1.2,0.5-1.7,0c-0.4-0.4-0.5-1.1-0.1-1.6l0.1-0.1L6.3,8L0.4,2C-0.1,1.6-0.1,0.9,0.4,0.4L0.4,0.4z" />
</svg>
</span>
</a>
</div>
</nav>
</section>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="spacer spacer--12"></div>
<div class="component content col-xs-12">
<div class="component-content" id='default-text'>
<section class="col-one"><div class="col-one__inner"><div class="col-one__content field-text"><style type="text/css">
<!--
section.col-one .col-one__inner .col-one__content.field-text {
text-align: center;
padding-top: 10px;
}
.combine-with {
margin-top: 30px;
}
.col-two__content {
padding: 30px 15px 40px;
}
.hero-product__description, p.usp-snippet__text.p--2.field-promotext2 {
letter-spacing: 0.1px;
}
.col-one__inner {
max-width: 1140px;
}
#the-bucket .section--9 {
max-width: 1170px;
}
section.col-one .media {
padding: 0;
}
section.media.media--grid.media--grid--B .media__item.in-view {
max-height: 320px;
margin-bottom: 4px;
}
section.media.media--grid.media--grid--B .video-player {
max-height: 320px;
}
section.media.media--grid.media--grid--B .in-view .media__item__inner {
background: #FFF;
}
.icon-play__inner {
/* opacity: 0.6; */
}
.combine-with__visual {
display: none;
}
div#videos {
/* display: block; */
/* padding-top: 150px; */
/* margin-top: -150px; */
}
#TutorialVideos .col-one__content {
max-width: 1170px !important;
/* padding: 0 var(--gutter--bucket) 0 0; */
}
#seeallvideos .col-one__content {
max-width: 1170px !important;
/* padding: 0 var(--gutter--bucket) 0 0; */
}
.col-one:not(.col-one--visual) .col-one__content {
font-size: var(--h--4)!important;
}
-->
</style></div></div></section> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
<div class="spacer spacer--30"></div>
<div class="component content back-to-top">
<div class="component-content" id='back-to-top'>
<div class="back-to-top__link">back to top <span class="back-to-top__arrow"></span></div> </div>
</div>
<!-- GRID EVENT TRACKING-->
<script>
document.addEventListener("DOMContentLoaded", function () {
var carouselElements = document.querySelectorAll('.hero-home__block');
carouselElements.forEach(function (element) {
element.addEventListener('click', function (e) {
// Check if the data has already been pushed for this click
if (element.hasAttribute('data-event-pushed')) return;
var imgElement = element.querySelector('#carouselactive');
if (imgElement) {
dataLayer.push({
'event': imgElement.getAttribute('dataEvent'),
'dlCategory': imgElement.getAttribute('dataCategory'),
'dlAction': imgElement.getAttribute('dataAction'),
'dlElement': imgElement.getAttribute('dataElements'),
'dlLabel': imgElement.getAttribute('dataLabls'),
'dlPosition': imgElement.getAttribute('dataPosition'),
'dlURL': imgElement.getAttribute('dataURL')
});
// Mark the event as pushed
element.setAttribute('data-event-pushed', 'true');
}
e.stopPropagation();
});
});
});
</script>
</div>
<!--BEGIN QUALTRICS WEBSITE FEEDBACK SNIPPET-->
<script type='text/javascript'>
(function(){var g=function(e,h,f,g){
this.get=function(a){for(var a=a+"=",c=document.cookie.split(";"),b=0,e=c.length;b<e;b++){for(var d=c[b];" "==d.charAt(0);)d=d.substring(1,d.length);if(0==d.indexOf(a))return d.substring(a.length,d.length)}return null};
this.set=function(a,c){var b="",b=new Date;b.setTime(b.getTime()+6048E5);b="; expires="+b.toGMTString();document.cookie=a+"="+c+b+"; path=/; "};
this.check=function(){var a=this.get(f);if(a)a=a.split(":");else if(100!=e)"v"==h&&(e=Math.random()>=e/100?0:100),a=[h,e,0],this.set(f,a.join(":"));else return!0;var c=a[1];if(100==c)return!0;switch(a[0]){case "v":return!1;case "r":return c=a[2]%Math.floor(100/c),a[2]++,this.set(f,a.join(":")),!c}return!0};
this.go=function(){if(this.check()){var a=document.createElement("script");a.type="text/javascript";a.src=g;document.body&&document.body.appendChild(a)}};
this.start=function(){var t=this;"complete"!==document.readyState?window.addEventListener?window.addEventListener("load",function(){t.go()},!1):window.attachEvent&&window.attachEvent("onload",function(){t.go()}):t.go()};};
try{(new g(100,"r","QSI_S_ZN_bguvlNheEQIvQBU","https://znbguvlnheeqivqbu-pioneerdj.siteintercept.qualtrics.com/SIE/?Q_ZID=ZN_bguvlNheEQIvQBU")).start()}catch(i){}})();
</script><div id='ZN_bguvlNheEQIvQBU'><!--DO NOT REMOVE-CONTENTS PLACED HERE--></div>
<!--END WEBSITE FEEDBACK SNIPPET-->
<footer class="footer theme-2020">
<div class="footer__brand">
<div class="footerBrand">
<div class="footerBrand__logo">
<svg class="symbol symbol--dj" viewBox="0 0 39 25" version="1" xmlns="http://www.w3.org/2000/svg">
<path d="M25.122 2.049c2.395 1.86 2.787 4.38 1.8 7.019-.919 2.442-2.98 4.81-6.22 6.642-3.592 1.994-7.308 2.525-11.363 2.525H0L6.844 0h8.209c4.14 0 7.638.164 10.069 2.049zm-5.057 6.883c.538-1.437.4-3.579-.552-4.723-1.07-1.27-2.719-1.419-5.1-1.419l-1.163.026s-1-.113-1.407.796c-.248.57.104-.426-3.92 10.305-.53 1.423.735 1.493.735 1.493s4.54.277 8.34-2.352c1.61-1.114 2.562-2.772 3.067-4.126zm9.65-2.385L39 6.594l-4.7 12.564C32.767 23.25 29.594 25 23.231 25l-4.969-.066 1.188-2.837c7.193.343 8.49-2.86 8.717-3.475l3-8.07s.516-1.437-.652-1.437h-1.84l1.04-2.568z"
fill="currentColor"></path>
</svg>
</div>
<nav class="footerBreadcrumb">
<ul class="footerBreadcrumb__list">
<li class="footerBreadcrumb__item">
<a href='https://preprod.pioneerdj.com/en/product/' class="footerBreadcrumb__link">Product</a>
</li>
<li class="footerBreadcrumb__item">
<a href='https://preprod.pioneerdj.com/en/product/controller/' class="footerBreadcrumb__link">DJ Controller</a>
</li>
<li class="footerBreadcrumb__item">
<a href='https://preprod.pioneerdj.com/en/product/controller/ddj-flx10/' class="footerBreadcrumb__link">DDJ-FLX10</a>
</li>
<li class="footerBreadcrumb__item">
Overview </li>
</ul>
</nav>
</div>
</div>
<div class="footer__nav">
<nav class="footerNav">
<div class="footerNav__content">
<h3 class="footerNav__title heading heading--4">
<a href="/en/product/" class="footerNav__title__link" >Products</a>
<span class="footerNav__trigger footerNav__triggerIcon"></span>
</h3>
<div class="footerNav__menu" style="height: 264px;">
<ul class="footerNav__list">
<li class="footerNav__item"><a href="/en/product/player/" class="footerNav__link" >DJ Players / Turntables</a></li>
<li class="footerNav__item"><a href="/en/product/mixer/" class="footerNav__link" >DJ mixers</a></li>
<li class="footerNav__item"><a href="/en/product/all-in-one-system/" class="footerNav__link" >All-in-one DJ systems</a></li>
<li class="footerNav__item"><a href="/en/product/controller/" class="footerNav__link" >DJ controllers</a></li>
<li class="footerNav__item"><a href="/en/product/software/" class="footerNav__link" >Softwares / Interfaces</a></li>
<li class="footerNav__item"><a href="/en/product/dj-sampler/" class="footerNav__link" >DJ samplers</a></li>
<li class="footerNav__item"><a href="/en/product/effector/" class="footerNav__link" >DJ effectors</a></li>
<li class="footerNav__item"><a href="/en/product/production/" class="footerNav__link" >Music production</a></li>
<li class="footerNav__item"><a href="/en/product/headphones/" class="footerNav__link" >Headphones</a></li>
<li class="footerNav__item"><a href="/en/product/monitor-speakers/" class="footerNav__link" >Monitor speakers</a></li>
<li class="footerNav__item"><a href="https://www.alphatheta.com/product/portable-dj-speaker/wave-eight/black/" class="footerNav__link" rel="noopener noreferrer" target="_blank" >Portable DJ Speakers</a></li>
<li class="footerNav__item"><a href="/en/product/pa-speakers/" class="footerNav__link" >PA speakers</a></li>
<li class="footerNav__item"><a href="/en/product/accessories/" class="footerNav__link" >Accessories</a></li>
</ul>
</div>
</div>
<div class="footerNav__content">
<h3 class="footerNav__title heading heading--4">
<a href="/en/support/" class="footerNav__title__link" >Support</a>
<span class="footerNav__trigger footerNav__triggerIcon"></span>
</h3>
<div class="footerNav__menu" style="height: 192px;">
<ul class="footerNav__list">
<li class="footerNav__item">
<a href="/en/support/contact/" class="footerNav__link" title="Contact" >Contact</a>
</li>
<li class="footerNav__item">
<a href="/en/support/documents/" class="footerNav__link" >Manuals</a>
</li>
<li class="footerNav__item">
<a href="/en/support/software/" class="footerNav__link" >Software & firmware</a>
</li>
<li class="footerNav__item">
<a href="/en/support/software-information/" class="footerNav__link" >Software information</a>
</li>
<li class="footerNav__item">
<a href="http://faq.pioneerdj.com" class="footerNav__link" rel="noopener noreferrer" target="_blank" >FAQ <span class="footerNav__icon"><svg class="symbol symbol--external" viewBox="0 0 32 32" version="1" xmlns="http://www.w3.org/2000/svg"><path d="M20 0l3.2 3.2H1.6C.8 3.2 0 4 0 4.96V30.4c0 .8.8 1.6 1.6 1.6h24.8c.96 0 1.6-.8 1.6-1.76V8.48l.16-.16 3.84 4V0H20zm4.8 28.64H3.36V6.56h17.76l-12 12.32 4.48 4.48 11.2-11.52v16.8z" fill="currentColor"></path></svg></span>
</a>
</li>
<li class="footerNav__item">
<a href="https://community.pioneerdj.com/" class="footerNav__link" rel="noopener noreferrer" target="_blank" >Forum <span class="footerNav__icon"><svg class="symbol symbol--external" viewBox="0 0 32 32" version="1" xmlns="http://www.w3.org/2000/svg"><path d="M20 0l3.2 3.2H1.6C.8 3.2 0 4 0 4.96V30.4c0 .8.8 1.6 1.6 1.6h24.8c.96 0 1.6-.8 1.6-1.76V8.48l.16-.16 3.84 4V0H20zm4.8 28.64H3.36V6.56h17.76l-12 12.32 4.48 4.48 11.2-11.52v16.8z" fill="currentColor"></path></svg></span>
</a>
</li>
<li class="footerNav__item">
<a href="/en/landing/pioneer-dj-certified/" class="footerNav__link" >Certification program</a>
</li>
<li class="footerNav__item">
<a href="/en/account/about/" class="footerNav__link" >About your account</a>
</li>
<li class="footerNav__item">
<a href="/en/support/important-product-notice/" class="footerNav__link" >Important product notices</a>
</li>
</ul>
</div>
</div>
<div class="footerNav__content">
<h3 class="footerNav__title heading heading--4">
<a href="/en/news/" class="footerNav__title__link" title="News" >News</a>
</h3>
<h3 class="footerNav__title heading heading--4">
<a href="https://alphatheta.com/en/company/" class="footerNav__title__link" rel="noopener noreferrer" target="_blank" >About us</a>
<span class="footerNav__trigger footerNav__triggerIcon"></span>
</h3>
<div class="footerNav__menu" style="height: 48px;">
<ul class="footerNav__list">
<li class="footerNav__item"><a href="https://alphatheta.com/en/company/#company-info" class="footerNav__link" rel="noopener noreferrer" target="_blank" >Company info</a></li>
<li class="footerNav__item"><a href="https://alphatheta.com/en/company/#company-info" class="footerNav__link" rel="noopener noreferrer" target="_blank" >Corporate contact</a></li>
</ul>
</div>
</div>
</nav>
</div>
<div class="footer__nav">
<div class="footer-ext-nav">
<div class="footer-ext-nav__inner">
<ul class="footer-ext-nav__list footer-ext-nav__list--brands">
<li>
<a href="https://alphatheta.com/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank" > <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 117 18.7" width="117" height="18.7">
<title>AlphaTheta</title>
<path fill="currentColor" d="m32.28 2.62 4.89 12.69h-2.38l-1.19-3.36h-5.06l-1.19 3.36h-2.29l4.87-12.69h2.36ZM31.05 4.8l-1.92 5.45H33L31.1 4.8h-.05Zm9.47-2.18v12.69h-2.03V2.62h2.03Zm11.18 8.14c0 2.42-1.21 4.8-3.96 4.8-1.15 0-2.45-.41-3.07-1.44h-.04v4.58H42.6V6.12h1.92v1.24h.04c.59-1.07 1.67-1.49 2.84-1.49 2.88 0 4.3 2.2 4.3 4.89Zm-4.57 3.19c1.83 0 2.54-1.63 2.54-3.23s-.76-3.25-2.56-3.25c-1.88 0-2.56 1.6-2.56 3.25s.78 3.23 2.58 3.23Zm7.95-11.33v4.71h.04c.59-.92 1.62-1.46 2.77-1.46 2.11 0 3.23 1.23 3.23 3.06v6.38h-2.03V9.62c0-1.17-.36-2.15-1.79-2.15s-2.22 1.16-2.22 2.36v5.47h-2.03V2.62h2.03Zm15.69 5.86v4.83c0 .48.11.64.55.64.11 0 .28 0 .43-.04v1.4c-.52.14-1.05.23-1.28.23-.89 0-1.42-.36-1.56-1.12-.73.73-2.06 1.12-3.18 1.12-1.81 0-3.15-1-3.15-2.68s1.01-2.4 2.38-2.68c.69-.14 1.46-.23 2.31-.34 1.23-.14 1.6-.43 1.6-1.14 0-.8-.64-1.24-1.9-1.24s-1.94.53-2.03 1.46h-2.03c.14-2.01 1.6-3.06 4.18-3.06 2.22 0 3.68 1.05 3.68 2.61Zm-4.43 5.47c1.39 0 2.4-.69 2.4-1.69V10.7c-.55.34-.82.34-2.22.52-1.33.16-1.92.64-1.92 1.47 0 .76.64 1.26 1.74 1.26ZM81.41 2.62v1.92h-4.03v10.77h-2.22V4.54h-4.02V2.62h10.27Zm3.04 0v4.71h.04c.59-.92 1.62-1.46 2.77-1.46 2.11 0 3.23 1.23 3.23 3.06v6.38h-2.03V9.62c0-1.17-.36-2.15-1.79-2.15s-2.22 1.16-2.22 2.36v5.47h-2.03V2.62h2.03Zm16.19 7.92c0 .23-.02.46-.04.69h-6.75c0 1.51.87 2.72 2.47 2.72 1.12 0 1.87-.46 2.24-1.53h1.92c-.41 1.97-2.15 3.13-4.16 3.13-2.9 0-4.5-2.03-4.5-4.82s1.71-4.87 4.44-4.87c2.59 0 4.37 2.13 4.37 4.67Zm-2.07-.64c-.11-1.28-.94-2.43-2.33-2.43s-2.33 1.08-2.4 2.43h4.73Zm6.21-6.54v2.75h1.83v1.51h-1.83v5.01c0 .96.23 1.16 1.01 1.16.37 0 .75-.04.82-.07v1.56c-.8.09-1.03.11-1.31.11-1.94 0-2.54-.62-2.54-2.47V7.63h-1.53V6.12h1.53V3.37h2.03Zm11.24 5.12v4.83c0 .48.11.64.55.64.11 0 .28 0 .43-.04v1.4c-.52.14-1.05.23-1.28.23-.89 0-1.42-.36-1.56-1.12-.73.73-2.06 1.12-3.18 1.12-1.81 0-3.14-1-3.14-2.68s1.01-2.4 2.38-2.68c.69-.14 1.46-.23 2.31-.34 1.23-.14 1.6-.43 1.6-1.14 0-.8-.64-1.24-1.9-1.24s-1.94.53-2.03 1.46h-2.03c.14-2.01 1.6-3.06 4.18-3.06 2.22 0 3.68 1.05 3.68 2.61Zm-4.42 5.47c1.39 0 2.4-.69 2.4-1.69V10.7c-.55.34-.82.34-2.22.52-1.33.16-1.92.64-1.92 1.47 0 .76.64 1.26 1.74 1.26ZM18.46 1.35C15.26-1.26 10.62.22 7.85 3.19c-.37.4-.71.84-1.03 1.3 1.61-2.12 4.01-3.46 6.35-3.28 3.44.26 5.42 3.69 4.44 7.66-.98 3.97-4.56 6.98-8 6.72-3.08-.23-4.99-3-4.65-6.43 1.03-.57 2.18-.78 3.21-.51 2.02.54 2.86 2.75 1.95 5 .29-.64.49-1.31.55-1.96.03-.29.03-.58 0-.88-.18-2.24-1.97-4.18-4.93-3.68-4.78.81-7.31 6.14-4.68 9.28 1.61 1.91 4.48 1.63 6.52.27 1.58 1.12 3.75 1.51 6.26.58 7.28-2.69 9.66-11.77 4.61-15.9ZM4.31 17.12c-2.09-.56-2.92-2.91-1.85-5.25.53-1.16 1.43-2.1 2.45-2.68-.14.81-.18 1.62-.11 2.39l.06.53c.04.29.11.57.18.85.41 1.48 1.26 2.79 2.46 3.66-1.02.56-2.17.77-3.2.5Z"></path>
</svg></a> </li>
<li>
<a href="https://rekordbox.com/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank" > <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 124 17.156" width="124" height="17.156">
<title>rekordbox</title>
<path fill="currentColor" d="M12.479 7.167a4.932 4.932 0 0 1 .265 1.6 4.983 4.983 0 0 1-4 4.887v3.507l6.14-3.545a1.272 1.272 0 0 0 .635-1.1v-7.1l-3.04 1.751m-8.454-1.7a4.969 4.969 0 0 1 7.465 0l3.038-1.755L8.393.17a1.279 1.279 0 0 0-1.275 0L.978 3.716l3.036 1.755ZM2.772 8.762a4.905 4.905 0 0 1 .265-1.6L0 5.41v7.09a1.279 1.279 0 0 0 .635 1.1l6.14 3.545v-3.501a4.977 4.977 0 0 1-4-4.887Zm7.482 0a2.493 2.493 0 0 1-2.49 2.5h-.006a2.494 2.494 0 0 1-2.5-2.491v-.009a2.493 2.493 0 0 1 2.496-2.495 2.494 2.494 0 0 1 2.5 2.491ZM81.746.186v3.391h-3.992a15.888 15.888 0 0 0-2.558.21 2.958 2.958 0 0 0-2.313 2.745 23.086 23.086 0 0 0 0 4.461 2.964 2.964 0 0 0 2.317 2.745 16 16 0 0 0 2.558.209q3.3 0 6.609.012V.186Zm0 11.68h-3.214c-2.783 0-3.142-.353-3.142-3.109s.359-3.109 3.142-3.109h3.214Zm16.278-5.34a2.961 2.961 0 0 0-2.313-2.744 15.875 15.875 0 0 0-2.557-.21h-3.992V.186h-2.617v13.762q3.3 0 6.609-.012a15.324 15.324 0 0 0 2.557-.209 2.957 2.957 0 0 0 2.313-2.745 23.1 23.1 0 0 0 0-4.462Zm-5.649 5.339h-3.213V5.648h3.213c2.783 0 3.142.353 3.142 3.109s-.359 3.109-3.142 3.109ZM62.96 6.477a3.135 3.135 0 0 0-2.694-2.745 21.117 21.117 0 0 0-5.952 0 3.129 3.129 0 0 0-2.695 2.745 21.1 21.1 0 0 0 0 4.577 3.135 3.135 0 0 0 2.694 2.746 21.124 21.124 0 0 0 5.953 0 3.131 3.131 0 0 0 2.694-2.745 21.1 21.1 0 0 0 0-4.577m-2.584 3.959a1.385 1.385 0 0 1-.778 1.209 2.476 2.476 0 0 1-1.2.243 19.051 19.051 0 0 1-2.755-.039 1.4 1.4 0 0 1-1.266-.833 2.559 2.559 0 0 1-.213-1.117 19.263 19.263 0 0 1 .036-2.822 1.385 1.385 0 0 1 .778-1.209 2.556 2.556 0 0 1 1.2-.243 19.065 19.065 0 0 1 2.756.039 1.4 1.4 0 0 1 1.264.833 2.545 2.545 0 0 1 .21 1.116 19.988 19.988 0 0 1-.039 2.822m50.763-3.959a3.136 3.136 0 0 0-2.695-2.745 21.117 21.117 0 0 0-5.952 0A3.131 3.131 0 0 0 99.8 6.477a21.1 21.1 0 0 0 0 4.577 3.137 3.137 0 0 0 2.695 2.745 21.117 21.117 0 0 0 5.952 0 3.132 3.132 0 0 0 2.695-2.745 21.1 21.1 0 0 0 0-4.577m-2.584 3.959a1.388 1.388 0 0 1-.779 1.209 2.47 2.47 0 0 1-1.2.243 19.2 19.2 0 0 1-2.756-.039 1.4 1.4 0 0 1-1.265-.833 2.544 2.544 0 0 1-.209-1.116 19.126 19.126 0 0 1 .038-2.822 1.386 1.386 0 0 1 .779-1.209 2.552 2.552 0 0 1 1.2-.243 19.061 19.061 0 0 1 2.756.039 1.4 1.4 0 0 1 1.265.833 2.544 2.544 0 0 1 .209 1.116 20.13 20.13 0 0 1-.038 2.822m-39.6-4.711a1.7 1.7 0 0 0-.585.193 2.176 2.176 0 0 0-.343.244 1.276 1.276 0 0 0-.315.447 2.159 2.159 0 0 0-.132.7c-.044.507-.033 1.016-.033 1.529v5.108h-2.663V8.757a20.108 20.108 0 0 1 .122-2.231 2.521 2.521 0 0 1 .314-1.049 3.161 3.161 0 0 1 .641-.861 3.3 3.3 0 0 1 .922-.608 5.114 5.114 0 0 1 1.32-.3 10.471 10.471 0 0 1 1.1-.083c.734-.028 2.529-.067 2.529-.067v2.079a24.756 24.756 0 0 0-2.883.088m-44.766 0a1.7 1.7 0 0 0-.585.193 2.176 2.176 0 0 0-.343.244 1.263 1.263 0 0 0-.315.447 2.159 2.159 0 0 0-.132.7c-.044.507-.033 1.016-.033 1.529v5.108h-2.657V8.757a20.108 20.108 0 0 1 .122-2.231 2.508 2.508 0 0 1 .315-1.049 3.146 3.146 0 0 1 .641-.861 3.29 3.29 0 0 1 .921-.608 5.124 5.124 0 0 1 1.32-.3 10.471 10.471 0 0 1 1.1-.083c.734-.028 2.528-.067 2.528-.067v2.079a24.74 24.74 0 0 0-2.882.088m21.783 3.037 5.268-5.185h-2.893l-3.86 4.147h-.276V3.577h-2.634v10.371h2.634V9.8h.27l3.866 4.153h2.893l-5.273-5.191h.005ZM124 3.577h-2.893l-3.313 3.612-3.319-3.612h-2.893l4.759 5.185-4.759 5.186h2.893l3.319-3.611 3.313 3.611H124l-4.76-5.186Zm-84.519 7.317h-2.628c-.022.077-.066.22-.066.22a.924.924 0 0 1-.879.691 19.313 19.313 0 0 1-4.218 0 1.046 1.046 0 0 1-.928-.911c-.061-.554-.1-1.111-.116-1.668h8.945v-.309a20.083 20.083 0 0 0-.121-2.452 3.135 3.135 0 0 0-2.694-2.745 21.124 21.124 0 0 0-5.953 0 3.131 3.131 0 0 0-2.695 2.745 21.1 21.1 0 0 0 0 4.578 3.135 3.135 0 0 0 2.695 2.744 21.043 21.043 0 0 0 5.952 0 2.912 2.912 0 0 0 .387-.077c.127-.033.248-.078.37-.122a3.142 3.142 0 0 0 .961-.613 2.321 2.321 0 0 0 .259-.276 2.926 2.926 0 0 0 .414-.635 2.835 2.835 0 0 0 .2-.513 3.679 3.679 0 0 0 .1-.541c0-.033.011-.067.011-.105v-.011m-8.709-4.285a1.044 1.044 0 0 1 .927-.911 19.2 19.2 0 0 1 4.219 0 1.044 1.044 0 0 1 .928.91c.039.354.072.7.094 1.056h-6.257c.018-.353.049-.7.095-1.055Z"></path>
</svg></a> </li>
<li>
<a href="https://kuvo.com/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank" ><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 64 16.054" width="64" height="16.054">
<title>KUVO</title>
<path fill="currentColor" d="M38.952 13.236a.226.226 0 0 0 .418-.008L43.592.393h2.763l-4.987 14.02a2.207 2.207 0 0 1-2.356 1.514 2.249 2.249 0 0 1-2.319-1.709L31.773.406h2.82ZM0 .399h2.532v15.422H0zm29.073 4.69a1.278 1.278 0 0 0-2.547.125v4.53a3.963 3.963 0 0 1-7.118 2.276 3.916 3.916 0 0 1-.7-2.381V.4h-2.58v9.232a7.721 7.721 0 0 0 .054.966 5.853 5.853 0 0 0 2.881 4.5 6.874 6.874 0 0 0 4.235.9 6.268 6.268 0 0 0 4-1.764 6.04 6.04 0 0 0 1.8-4.476Z"></path>
<circle cx="1.29" cy="1.29" r="1.29" fill="currentColor" transform="translate(26.503 .416)"></circle>
<path fill="currentColor" d="M61.186 2.351A8.04 8.04 0 0 0 51.962.818l1.1 2.34a5.447 5.447 0 1 1-2.944 5.643 1.29 1.29 0 1 0-2.548.4 8.028 8.028 0 1 0 13.618-6.849Z"></path>
<circle cx="1.301" cy="1.301" r="1.301" fill="currentColor" transform="translate(47.784 4.069)"></circle>
<path fill="currentColor" d="M6.745 8.298a.563.563 0 0 1 .01-.881l6.184-7.02H9.768L4.451 6.478a2.1 2.1 0 0 0 .035 3.13l5.366 6.229h3.316Z"></path>
</svg></a> </li>
<li>
<a href="https://www.pioneerdj.com/en/landing/toraiz-brand/" class="footer-ext-nav__link" > <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 81 17.1" width="81" height="17.1">
<title>TORAIZ</title>
<path fill="currentColor" d="M64.596.312h4.199v16.443h-4.199zM19.886 0a8.529 8.529 0 1 1-.023 17.054 8.475 8.475 0 0 1-8.644-8.333 9.282 9.282 0 0 1 .645-3.51A8.546 8.546 0 0 1 19.886 0m.067 13.367c2.978 0 4.423-2.71 4.423-4.821s-1.445-4.858-4.467-4.858a4.578 4.578 0 0 0-4.489 4.8 4.611 4.611 0 0 0 4.533 4.879M55.055.312h-2.74L44.2 14.389l1.367 2.367h16.25l1.367-2.367Zm-5.517 12.754L53.7 5.85l4.171 7.216Zm-6.016-7.087A5.7 5.7 0 0 0 41.5 1.49C40.434.667 39.323.312 36.431.312h-6.158v16.443h4.2V4h2.3c1.614 0 2.711.733 2.711 2.221 0 .8-.288 2.353-2.75 2.356h-.578v2.574L39 16.755h4.522l-3.335-5.78a5.08 5.08 0 0 0 3.335-5M70.622 14l5.66-10h-5.66V.315h10.371v3.4l-5.239 9.357H81v3.687H70.629ZM3.245 4H0V.315h10.666V4H7.439v12.756H3.245Z"></path>
</svg></a> </li>
<li>
<a href="https://www.pioneerproaudio.com/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank" > <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 97 14.32" width="97" height="14.32">
<title>Pioneer PRO AUDIO</title>
<path fill="currentColor" d="M0 13.792c.084-.2.18-.389.252-.591.87-2.4 1.7-4.808 2.614-7.188a9.053 9.053 0 0 1 3.3-4.374A9.1 9.1 0 0 1 10.178.178a15.082 15.082 0 0 1 6.129.294 7.763 7.763 0 0 1 3.148 1.618 3.424 3.424 0 0 1 .685 4.593 6.2 6.2 0 0 1-3.74 2.689 13.043 13.043 0 0 1-4.748.361c-.87-.068-1.731-.22-2.6-.326-.2-.025-.281-.113-.323-.322-.188-.935-.4-1.865-.6-2.8-.014-.061-.02-.124-.035-.228.585.109 1.14.224 1.7.313a11.946 11.946 0 0 0 4.343.088 4.75 4.75 0 0 0 1.55-.606 1.066 1.066 0 0 0 .013-1.904 3.8 3.8 0 0 0-1.9-.676 9.148 9.148 0 0 0-3.655.25A4.468 4.468 0 0 0 7.125 6.5a715.58 715.58 0 0 0-2.516 7.121.381.381 0 0 1-.435.309c-1.391-.011-2.783 0-4.174 0Zm40.87.127a2.435 2.435 0 0 1 .06-.239c.5-1.391.99-2.784 1.5-4.169a5.282 5.282 0 0 1 3.154-3.2 11.487 11.487 0 0 1 6.864-.478 4.938 4.938 0 0 1 1.6.739A2.392 2.392 0 0 1 55 9.435c-.483 1.442-1.017 2.867-1.538 4.3a.308.308 0 0 1-.214.18c-1.3.011-2.607.008-3.953.008.047-.151.081-.274.124-.394l1.325-3.674a1.188 1.188 0 0 0-.86-1.742 2.8 2.8 0 0 0-3.458 1.74c-.455 1.266-.907 2.534-1.371 3.8-.04.108-.165.261-.253.262-1.3.016-2.607.011-3.932.011M97 5.916c-.024.1-.038.184-.065.262-.208.611-.426 1.219-.623 1.834a.3.3 0 0 1-.346.248c-.819-.011-1.639-.005-2.458-.005a1.61 1.61 0 0 0-1.83 1.276q-.733 2.021-1.419 4.059a.418.418 0 0 1-.484.336c-1.132-.014-2.264-.006-3.4-.006h-.353c.056-.17.1-.3.142-.435q.816-2.34 1.634-4.679a3.9 3.9 0 0 1 2.724-2.748 5.122 5.122 0 0 1 1.217-.158c1.671-.017 3.343-.007 5.014-.006.073 0 .145.012.246.021m-71.006-.021c-.05.164-.08.278-.119.388q-1.316 3.66-2.628 7.323c-.08.226-.173.325-.429.322-1.293-.016-2.587-.007-3.93-.007.034-.125.055-.225.089-.32q1.324-3.708 2.657-7.418a.37.37 0 0 1 .417-.294c1.294.012 2.587.006 3.943.006m43.944 5.239c-.282.79-.537 1.536-.819 2.27a.535.535 0 0 1-.327.254 17.815 17.815 0 0 1-5.954.63 11.4 11.4 0 0 1-4.183-.9 5.274 5.274 0 0 1-2.1-1.555 2.583 2.583 0 0 1-.25-3.037 5.028 5.028 0 0 1 2.1-2 10.413 10.413 0 0 1 3.919-1.152 12.053 12.053 0 0 1 6.032.77 8.414 8.414 0 0 1 1.56.919 2.693 2.693 0 0 1 .672.744 1.039 1.039 0 0 1-.194 1.45 4.448 4.448 0 0 1-1.161.692 12.109 12.109 0 0 1-3.41.7 12.538 12.538 0 0 1-5.094-.373c-.571-.18-1.113-.452-1.685-.689a1.227 1.227 0 0 0 .4 1.01 3.524 3.524 0 0 0 1.712.875 13.312 13.312 0 0 0 4.757.234 17.829 17.829 0 0 0 3.851-.823 1.255 1.255 0 0 1 .172-.025m-9.379-2.836c.26.1.438.173.623.228a11.429 11.429 0 0 0 3.645.417 9.466 9.466 0 0 0 1.471-.185c.148-.029.269-.208.4-.319a2.892 2.892 0 0 0-.367-.367.993.993 0 0 0-.392-.141c-.5-.087-1-.187-1.5-.233a8.307 8.307 0 0 0-3.882.6m24.961 2.838c-.286.8-.548 1.551-.835 2.3a.5.5 0 0 1-.308.232 17.9 17.9 0 0 1-5.956.63 11.634 11.634 0 0 1-4.035-.83 5.773 5.773 0 0 1-1.991-1.322 2.7 2.7 0 0 1-.324-3.645A5.454 5.454 0 0 1 74.5 6.54a12.086 12.086 0 0 1 5.6-.957 10.3 10.3 0 0 1 3.656.766A14.608 14.608 0 0 1 85.6 7.417a1.8 1.8 0 0 1 .429.444 1.183 1.183 0 0 1-.24 1.851 4.784 4.784 0 0 1-1.9.8 15.485 15.485 0 0 1-6.8.229 16.972 16.972 0 0 1-2.24-.82c-.066-.025-.129-.066-.228-.117a1.269 1.269 0 0 0 .394 1.056 3.5 3.5 0 0 0 1.709.881 13.273 13.273 0 0 0 4.758.237 17.6 17.6 0 0 0 3.852-.823 1.522 1.522 0 0 1 .183-.03m-9.386-2.832a5.078 5.078 0 0 0 .638.226c.653.133 1.306.288 1.966.359a8.7 8.7 0 0 0 3.022-.1 1.915 1.915 0 0 0 .527-.356c-.166-.139-.313-.356-.5-.4a12.066 12.066 0 0 0-1.742-.322 8.162 8.162 0 0 0-3.911.6m-43.108 6.02a11.072 11.072 0 0 1-4.886-1.056 5.07 5.07 0 0 1-1.822-1.445 2.624 2.624 0 0 1-.13-3.156 5.228 5.228 0 0 1 2.01-1.769 11.818 11.818 0 0 1 6.226-1.309A10.392 10.392 0 0 1 38.7 6.6a5.3 5.3 0 0 1 1.73 1.31 2.667 2.667 0 0 1 .123 3.5 6.227 6.227 0 0 1-2.726 1.99 12.464 12.464 0 0 1-4.8.921m.415-2.495c.262-.038.673-.068 1.069-.16a3.174 3.174 0 0 0 1.721-.914 1.234 1.234 0 0 0-.067-1.837 1.612 1.612 0 0 0-.565-.385 8.923 8.923 0 0 0-1.638-.43 4.33 4.33 0 0 0-2.6.491 2.825 2.825 0 0 0-.677.5 1.24 1.24 0 0 0 .09 1.947 4.121 4.121 0 0 0 2.661.791"></path>
</svg></a> </li>
</ul>
<ul class="footer-ext-nav__list footer-ext-nav__list--ext">
<li class="footer-ext-nav__link footer-ext-nav__link--youtube">
<a href="https://www.youtube.com/user/pioneerdjglobal" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank" > <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 18" width="24" height="18">
<title>YouTube</title>
<path fill="currentColor" d="M23.5 3.2c-.3-1-1.1-1.9-2.1-2.1C19.5.6 12 .6 12 .6s-7.5 0-9.4.5C1.6 1.4.8 2.2.5 3.2 0 5.1 0 9 0 9s0 3.9.5 5.8c.3 1 1.1 1.9 2.1 2.1 1.9.5 9.4.5 9.4.5s7.5 0 9.4-.5c1-.3 1.8-1.1 2.1-2.1.5-1.9.5-5.8.5-5.8s0-3.9-.5-5.8Zm-14 9.4V5.5l6.3 3.6-6.3 3.6Z"></path>
</svg> <span class="screenReader">YouTube</span>
</a> </li>
<li class="footer-ext-nav__link footer-ext-nav__link--instagram">
<a href="https://www.instagram.com/pioneerdjglobal/" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank" > <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20" width="20" height="20">
<title>Instagram</title>
<path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.296 0h1.408c2.082.003 2.452.016 3.42.06 1.063.049 1.79.218 2.426.465a4.902 4.902 0 0 1 1.772 1.154 4.903 4.903 0 0 1 1.153 1.77c.247.637.416 1.364.465 2.428.046 1.017.059 1.374.06 3.757v.733c-.001 2.382-.014 2.74-.06 3.756-.049 1.065-.218 1.792-.465 2.428a4.904 4.904 0 0 1-1.153 1.77 4.904 4.904 0 0 1-1.771 1.154c-.636.247-1.363.416-2.428.465-1.016.046-1.373.059-3.756.06h-.733c-2.383-.001-2.74-.014-3.757-.06-1.064-.049-1.791-.218-2.427-.465a4.903 4.903 0 0 1-1.771-1.153A4.902 4.902 0 0 1 .525 16.55C.278 15.915.11 15.188.06 14.122c-.044-.966-.057-1.337-.06-3.42V9.297c.003-2.082.016-2.452.06-3.419C.11 4.813.278 4.086.525 3.45A4.902 4.902 0 0 1 1.68 1.679 4.902 4.902 0 0 1 3.449.525C4.087.278 4.814.11 5.878.06 6.844.016 7.214.003 9.297 0Zm1.065 1.802H9.64c-2.341.001-2.676.012-3.68.058-.976.045-1.505.208-1.858.345-.466.181-.8.398-1.15.748-.35.35-.566.683-.747 1.15-.137.352-.3.881-.345 1.856-.046 1.005-.057 1.34-.058 3.68v.722c.001 2.34.012 2.675.058 3.68.045.975.208 1.505.345 1.857.181.467.398.8.748 1.15.35.35.683.566 1.15.748.352.137.881.3 1.856.344 1.022.047 1.35.058 3.798.058h.487c2.447 0 2.776-.011 3.797-.058.975-.044 1.505-.207 1.857-.344.467-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.352.3-.882.344-1.857.047-1.021.058-1.35.058-3.797v-.487c0-2.447-.011-2.776-.058-3.798-.044-.975-.207-1.504-.344-1.857a3.098 3.098 0 0 0-.748-1.15 3.098 3.098 0 0 0-1.15-.747c-.352-.137-.882-.3-1.857-.345-1.005-.046-1.34-.057-3.68-.058Zm-.236 2.948a5.125 5.125 0 1 1 0 10.25 5.125 5.125 0 0 1 0-10.25Zm0 1.798a3.327 3.327 0 1 0 0 6.654 3.327 3.327 0 0 0 0-6.654ZM15.25 3.5a1.25 1.25 0 1 1 0 2.5 1.25 1.25 0 0 1 0-2.5Z"></path>
</svg> <span class="screenReader">Instagram</span>
</a> </li>
<li class="footer-ext-nav__link footer-ext-nav__link--facebook">
<a href="https://www.facebook.com/pioneer.dj.global" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank" ><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20" width="20" height="20">
<title>Facebook</title>
<path fill="currentColor" d="M10 0C4.5 0 0 4.5 0 10s3.7 9.1 8.4 9.9v-7H5.9V10h2.5V7.8c0-2.5 1.5-3.9 3.8-3.9s2.2.2 2.2.2v2.5H12.7c-.9.2-1.2.8-1.2 1.5V10h2.8l-.4 2.9h-2.3v7C16.4 19.1 20 15 20 10S15.5 0 10 0Z"></path>
</svg> <span class="screenReader">Facebook</span>
</a> </li>
<li class="footer-ext-nav__link footer-ext-nav__link--twitter">
<a href="https://twitter.com/PioneerDJglobal" class="footer-ext-nav__link" rel="noopener noreferrer" target="_blank" > <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 18 18" width="18" height="18">
<title>X</title>
<path fill="currentColor" d="M10.477 7.618 17.03 0h-1.553l-5.69 6.614L5.242 0H0l6.873 10.002L0 17.991h1.553l6.01-6.985 4.799 6.985h5.242L10.476 7.618ZM8.35 10.09l-.697-.996-5.54-7.925h2.385l4.471 6.396.697.996 5.812 8.314h-2.385L8.35 10.09Z"></path>
</svg> <span class="screenReader">Twitter</span>
</a> </li>
</ul>
</div>
</div>
</div>
<div class="footer__legal">
<nav class="legalNav">
<ul class="legalNav__list" style="margin-top:20px !important">
<li class="legalNav__item">
<a href="https://alphatheta.com" class="text-bold" rel="noopener noreferrer" target="_blank" >© AlphaTheta Corporation</a>
</li>
<li class="legalNav__item">
<a href="https://alphatheta.com/en/company/privacy-policy/" class="legalNav__link" rel="noopener noreferrer" target="_blank" >Privacy policy</a>
</li>
<li class="legalNav__item">
<a href="https://alphatheta.com/en/company/terms-of-use/" class="legalNav__link" rel="noopener noreferrer" target="_blank" >Terms of use</a>
</li>
<li class="legalNav__item">
<a href="/en/company/cookie-policy/" class="legalNav__link" rel="noopener noreferrer" target="_blank" >Cookie Policy</a>
</li>
<li class="legalNav__item">
<a href="https://alphatheta.com/en/company/trademarks/" class="legalNav__link" rel="noopener noreferrer" target="_blank" >Trademarks</a>
</li>
<li class="legalNav__item">
<button id="ot-sdk-btn" class="ot-sdk-show-settings legalNav__link">Cookie Settings</button>
</li>
</ul>
</nav>
</div>
</footer>
<script src="/Scripts/jquery-1.11.3.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/uCommerce/uCommerce.jQuery.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/uCommerce/uCommerce.ServiceStack.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/uCommerce/pdj.uc.custom.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/Custom/checkout.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
<script src="/Scripts/Custom/theSticker.js?bundleVirtualPath=%7e%2fBundles%2fEcommerceJsFooter%2f"></script>
{{!-- <script src="https://preprod.pioneerdj.com/-/media/themes/pioneer/pioneerdj/productredesign-theme/scripts/main.js"></script> --}}
<script>
let originUrl = window.location.origin;
let scriptElement = document.createElement('script');
scriptElement.src = `${originUrl}/scripts/main.js`;
document.write(scriptElement.outerHTML);
</script>
<script type="text/javascript">
// polyfill for startsWith method
if (!String.prototype.startsWith) {
String.prototype.startsWith = function(searchString, position){
return this.substr(position || 0, searchString.length) === searchString;
};
}
function getQueryStringValueByName(name, url) {
if (!url) {
url = window.location.href;
}
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
//mark menu item as active
jQuery(".gigyaMenu ul li a").bind('click', function () {
jQuery(".gigyaMenu ul li a").removeClass("active");
jQuery(this).addClass("active");
});
var jwtToken;
function sendZendeskToken(data) {
jQuery.ajax({
type: "POST",
url: "/ForumConnector/zenssologin.aspx",
async: false,
data: data.user,
dataType: "jsonp",
complete: function (res) {
jwtToken = JSON.parse(res.responseText);
}
});
}
function onLogout(response) {
function loaded() {
jQuery.ajax({
url: "/en/" + "api/Account/Logout",
async: false,
cache: false,
success: function(data) {
if (data.Success) {
var logoutContainer = jQuery("#LogoutContainer");
var loginRegister = jQuery("#LoginRegister");
if (logoutContainer != undefined) {
logoutContainer.hide();
}
if (loginRegister != undefined) {
loginRegister.show();
}
location.reload();
}
},
error: function() {
alert("Error during logout!"); //TODO: other way to inform about the error
}
});
}
if (response.errorCode == 0) {
var iframe = document.createElement("iframe");
iframe.setAttribute("src", "https://pioneerdj-community.zendesk.com" + "/access/logout/");
iframe.style.width = 0;
iframe.style.height = 0;
if (iframe.addEventListener) {
iframe.addEventListener("load", loaded, false);
} else {
iframe.attachEvent("onload", loaded);
}
document.body.appendChild(iframe);
setTimeout(loaded, 850); //neccessary for firefox - in case iframe throws an error, firefox won't fire onload event
}
}
function onLoginSocialize(response) {
sendZendeskToken(response);
}
function loginToZendesk() {
function loaded() {
gigya.setSSOToken({
redirectURL: typeof (returnTo) === 'undefined' ? window.location.href : returnTo
});
window.location.reload();
}
var iframe = document.createElement("iframe");
iframe.setAttribute("src", "https://pioneerdj.zendesk.com" + "/access/jwt" + "?jwt=" + jwtToken.token);
iframe.style.width = 0;
iframe.style.height = 0;
document.body.appendChild(iframe);
iframe.onload = loaded;
iframe.onerror = loaded;
}
function onLogin(response) {
if (response != undefined && response.UID != undefined) {
// 206005 - autologin finalization triggered with email verification link
if (getQueryStringValueByName('errorCode') == '206005') {
gigya.accounts.getAccountInfo({ callback: onEmailVerified, include: 'emails,data' });
}
var queue = function () {
typeof jwtToken !== "undefined"
? loginToZendesk()
: setTimeout(function () {
queue();
}, 100);
};
queue();
}
}
function onEmailVerified(response) {
if (response != undefined && response.errorCode == 0) {
var verifiedEmails = response.emails.verified;
if (verifiedEmails.length > 1) {
// deactivate all account emails except for the new one that just got verified
var previousEmails = verifiedEmails.slice(0, verifiedEmails.length - 1).join(", ");
var storedEmails = response.data.previousEmailAddresses;
if (storedEmails != undefined) {
storedEmails = storedEmails + ", " + previousEmails;
} else {
storedEmails = previousEmails;
}
gigya.accounts.setAccountInfo({
removeLoginEmails: previousEmails,
data: { previousEmailAddresses: storedEmails }
});
}
}
}
function onProfileUpdate(response) {
if (response.response.errorCode === 0) {
if (response != undefined && response.profile != undefined) {
if (response.profile.photoURL != undefined) {
jQuery(".visual-wrap .in").css("background-image", "url('" + response.profile.photoURL + "')");
}
jQuery(".item-profile a .content-wrap .name").text(response.profile.firstName);
jQuery(".profile-box .content-wrap").html(response.profile.firstName + '<br/>');
}
showMessage("Your changes have been saved.");
}
}
function onPasswordChange(response) {
if (response.response.errorCode === 0) {
selectMenuItem();
showMessage("Your password has been changed.");
navigateEditMyProfile();
}
}
function onProfileFieldChange(response) {
if (response != undefined) {
jQuery('input[name="profile.email"]').bind('change', function () {
showMessage("Click ‘Save changes’ to change your email address. You’ll receive an email to verify your new email address.");
});
}
}
function selectMenuItem() {
jQuery(".errorSection").hide();
jQuery(".gigyaMenu ul li a").removeClass("active");
jQuery(".gigyaMenu ul li a").first().addClass("active");
}
function showMessage(message) {
jQuery(".errorSection").html("").hide();
document.getElementById("messageSection").style.display = "block";
document.getElementById("messageSection").innerHTML = message;
window.scrollTo(0, 0);
}
function showLicenses() {
showLoadingScreen();
redirectIfLoggedOut();
gigya.socialize.getUserInfo({ callback: generateUserLicences });
}
function generateUserLicences(response) {
var gigyaPageTarget = jQuery("#gigya-page-target");
if (response.errorCode == 0) {
var user = response['user'];
var uid = user['UID'];
jQuery.get('/api/sitecore/PioneerDjAccount/GetLicences', { userId: uid }, function (data) {
hideLoadingScreen();
if (isLicencesScreenDisplayed() === true) {
gigyaPageTarget.html(data);
var cell = jQuery(".licences-container .licence .item .key");
if (typeof cell !== 'undefined') { cell.matchHeight(); }
}
});
}
else {
gigyaPageTarget.html('No licences could be found.');
}
}
function isLicencesScreenDisplayed() {
return jQuery("#license_btn").hasClass("active");
}
function navigateChangePassword() {
parent.location.hash = 'password';
gigya.accounts.showScreenSet({
screenSet: 'pioneerdj.com-ProfileUpdate',
containerID: 'gigya-page-target',
startScreen: 'gigya-change-password-screen',
lang: 'en',
onAfterSubmit: changePasswordHandler,
onBeforeScreenLoad: redirectIfLoggedOut,
onError: errorEventHandler
});
}
function navigateEditMyProfile() {
parent.location.hash = 'editprofile';
gigya.accounts.showScreenSet({
screenSet: 'pioneerdj.com-ProfileUpdate',
lang: 'en',
containerID: 'gigya-page-target',
onError: errorEventHandler,
onAfterSubmit: updateProfileHandler,
onBeforeScreenLoad: redirectIfLoggedOut,
onAfterScreenLoad: changeProfileFieldHandler
});
}
function redirectIfLoggedOut() {
gigya.accounts.getAccountInfo({
callback: function(response) {
if (response.errorCode != 0) {
window.location.href = '/';
}
}
});
}
function createOneNewsletterOption(response) {
if (response != undefined) {
var pdjCheckbox = jQuery("[name='data.PDJ_newsletter'][data-screenset-roles='instance']");
var kuvoCheckbox = jQuery("[name='data.KUVO_newsletter'][data-screenset-roles='instance']");
var mainCheckbox = '<div class="gigya-composite-control gigya-composite-control-checkbox"' +
' style="display: block; margin-top:15px;"><input id="maincheckbox" type="checkbox">' +
'<label class="gigya-label" for="maincheckbox"><span class="gigya-label-text gigya-checkbox-text">' +
"Please keep me informed about Pioneer DJ products, services, features, including newsletters, promotions, events, tips and surveys." +
'</span></label></div>';
kuvoCheckbox.parent().after(mainCheckbox);
jQuery("#registerContainer").on('change', '#maincheckbox', function () {
pdjCheckbox.prop("checked", this.checked);
kuvoCheckbox.prop("checked", this.checked);
});
pdjCheckbox.parent().hide();
kuvoCheckbox.parent().hide();
}
}
// My Products functions
function handleMyProductsError(data) {
if (typeof data.responseJSON != 'undefined') {
errorEventHandler({
errorMessage: data.responseJSON.error,
response: {
info: {
screen: "gigya-my-products-screen"
}
}
});
} else {
errorEventHandler({
errorMessage: getErrorMessage(data),
response: {
info: {
screen: "gigya-my-products-screen"
}
}
});
}
}
function getErrorMessage(data) {
if (data.status == 401 || data.status == 403) {
return "Unauthorized user";
}
return "Unexpected error occurred";
}
function getAuthHeaders(response) {
var authHeaders = {
"PDJ-UID": response.user.UID,
"PDJ-Timestamp": response.user.signatureTimestamp,
"PDJ-UIDSignature": response.user.UIDSignature
}
return authHeaders;
}
function navigateMyProducts(msg) {
showLoadingScreen();
redirectIfLoggedOut();
gigya.socialize.getUserInfo({ callback: getMyProducts, context: msg });
}
function isMyProductsScreenDisplayed() {
return jQuery("#my-products-tab").hasClass("active");
}
function getMyProducts(response) {
var gigyaPageTarget = jQuery("#gigya-page-target");
if (response.errorCode == 0) {
jQuery.ajax({
type: 'GET',
url: '/api/sitecore/ProductRegistration/Get',
headers: getAuthHeaders(response),
cache: false,
success: function (data) {
if (isMyProductsScreenDisplayed() === true) {
gigyaPageTarget.html(data);
jQuery('a.btn-link[href="#"]').each(function (i, o) { jQuery(o).addClass('hidden'); });
initCompleter();
}
if (response.context) {
var msg = response.context;
jQuery('#validation-success')
.removeClass('hidden');
jQuery('#validation-success')
.html(msg);
}
window.scrollTo(0, 0);
var $purchaseDateInput = jQuery("#input-purchase-date");
$purchaseDateInput.attr('readonly', 'readonly');
$purchaseDateInput.datepicker({
changeMonth: true,
changeYear: true,
constrainInput: true,
dateFormat: "dd/mm/yy",
maxDate: "26/11/2024"
});
},
error: function (data) {
errorEventHandler({
errorMessage: data.responseJSON.error
});
},
complete: function() {
hideLoadingScreen();
}
});
}
}
function showLoadingScreen() {
jQuery("#gigya-page-target").children().hide();
jQuery("#loading-message").show();
}
function hideLoadingScreen() {
jQuery("#gigya-page-target").children().show();
jQuery("#loading-message").hide();
}
</script>
<script src="/Scripts/Custom/ui_fixes.js"></script>
<!-- /#wrapper -->
</body>
</html>
/* No context defined. */
// original zoomtool script:
/*
var oldzoomtool = {
zoomtool: {
init: function () {
// define variables
dj.overlayer.zoomtool.$trigger = $('.trigger__open-overlayer.zoom-tool');
// append plugin
dj.overlayer.zoomtool.layer = dj.overlayer.zoomtool.$trigger.layer({
topbar: false,
containers: false,
layerClasses: 'light',
//ready: function (layer) { },
opened: function (layer, trigger) {
dj.zoomtool.isOpen = true;
dj.zoomtool.init(layer, trigger);
},
closed: function () {
dj.zoomtool.isOpen = false;
dj.zoomtool.destroy();
}
});
}
},
zoomtool: {
init: function (layer, trigger) {
// define variables
dj.zoomtool.$overlayer = layer;
dj.zoomtool.$wrap = dj.zoomtool.$overlayer.find('.zoomtool__canvas');
dj.zoomtool.$element = dj.zoomtool.$overlayer.find('.zoomtool__element');
dj.zoomtool.$slider = dj.zoomtool.$overlayer.find('.zoomtool__scale .slider');
dj.zoomtool.$moreImages = dj.zoomtool.$overlayer.find('.zoomtool_more-images');
dj.zoomtool.$download = dj.zoomtool.$overlayer.find('.download-image');
dj.zoomtool.$folder = dj.zoomtool.$overlayer.find('.folder__container');
dj.zoomtool.$carousel = dj.zoomtool.$overlayer.find('.list .items');
dj.zoomtool.min = 0.01;
dj.zoomtool.max = 2;
dj.zoomtool.carouselHeight = 160;
// set images
dj.zoomtool.gallery = {};
dj.zoomtool.gallery.trigger = trigger.find('img');
dj.zoomtool.gallery.galleryId = dj.zoomtool.gallery.trigger.attr('rel');
dj.zoomtool.gallery.triggerSrc = dj.zoomtool.gallery.trigger.attr('src');
dj.zoomtool.gallery.triggerFull = dj.zoomtool.gallery.trigger.data('full');
dj.zoomtool.gallery.triggerLarge = dj.zoomtool.gallery.trigger.data('large');
dj.zoomtool.gallery.triggerSmall = dj.zoomtool.gallery.trigger.data('small');
dj.zoomtool.gallery.set = $('.zoomtool-capable[rel=' + dj.zoomtool.gallery.galleryId + ']').not(dj.zoomtool.gallery.trigger);
dj.zoomtool.gallery.hasSet = (dj.zoomtool.gallery.set.length > 1);
// define alt attribute
dj.zoomtool.altAttribute = dj.zoomtool.gallery.trigger.attr('alt') || '';
// write html
dj.zoomtool.generateHtml();
},
generateHtml: function () {
var thumbHtml,
//imageUrl,
imageFull,
//imageLarge,
imageSmall,
imageAlt,
forceSuffix;
// set large image
dj.zoomtool.$element.find('img').attr('src', dj.zoomtool.gallery.triggerFull);
dj.zoomtool.setImageDimensions();
// build image set
if (dj.zoomtool.gallery.hasSet) {
thumbHtml = '';
thumbHtml += '<div class="item-element active"><a href="#" class="switch-zoom" data-hi-res="' + dj.zoomtool.gallery.triggerFull + '"><img src="' + dj.zoomtool.gallery.triggerSmall + '" alt="' + dj.zoomtool.altAttribute + '" /></a></div>';
$.each(dj.zoomtool.gallery.set, function (i, el) {
//imageUrl = $(this).attr('src').split('?')[0];
imageFull = $(this).data('full');
//imageLarge = $(this).data('large');
imageSmall = $(this).data('small');
imageAlt = $(this).attr('alt') || '';
if (imageSmall !== dj.zoomtool.gallery.triggerSmall) {
thumbHtml += '<div class="item-element"><a href="#" class="switch-zoom" data-hi-res="' + imageFull + '"><img src="' + imageSmall + '" alt="' + imageAlt + '" /></a></div>';
}
});
// append other images to zoomtool
dj.zoomtool.$moreImages.find('.target').html(thumbHtml);
dj.zoomtool.$switchTrigger = dj.zoomtool.$moreImages.find('.switch-zoom');
// bind events
dj.zoomtool.$switchTrigger.bind('click', function (e) {
e.preventDefault();
// cache trigger
var triggerElement = $(this);
// destroy previous instances of the zoomtool
if (dj.zoomtool.zoomer) {
dj.zoomtool.$element.panzoom('destroy');
}
// add loader
dj.zoomtool.$overlayer.removeClass('loaded');
dj.zoomtool.$element.find('img').removeAttr('width').removeAttr('height');
// define alt attribute
dj.zoomtool.altAttribute = triggerElement.find('img').attr('alt');
setTimeout(function () {
// set active class
triggerElement.parents('.items').eq(0).find('.item-element').removeClass('active');
triggerElement.parents('.item-element').eq(0).addClass('active');
//
forceSuffix = (triggerElement.data('hi-res').indexOf('?') < 0) ? "?force=1" : "&force=1";
// switch image
dj.zoomtool.$element.find('img').attr('src', triggerElement.data('hi-res'));
dj.zoomtool.$download.attr('href', triggerElement.data('hi-res') + forceSuffix);
dj.zoomtool.setImageDimensions();
//dj.zoomtool.$element.panzoom('resetZoom');
//dj.zoomtool.$element.panzoom('resetPan');
}, 1000);
});
} else {
dj.zoomtool.$moreImages.hide();
}
// set download url
forceSuffix = (dj.zoomtool.gallery.triggerFull.indexOf('?') < 0) ? "?force=1" : "&force=1";
dj.zoomtool.$download.attr('href', dj.zoomtool.gallery.triggerFull + forceSuffix);
},
setImageDimensions: function () {
// cache current image
var currentImage = dj.zoomtool.$element.find('img');
currentImage.attr('style', '').removeAttr('width').removeAttr('height');
// get load callback
currentImage.unbind('load').load(function () {
var imageWidth = currentImage.width(),
imageHeight = currentImage.height(),
//imageRatio = imageHeight / imageWidth,
layerContent = dj.zoomtool.$overlayer.find('.overlayer__content-wrap'),
//carouselHeight = (dj.zoomtool.gallery.hasSet && dj.viewport.w > 767) ? dj.zoomtool.carouselHeight + 20 : 0,
topbarHeight = dj.zoomtool.$overlayer.find('.zoomtool__topbar').height(),
layerWidth = layerContent.width(),
layerHeight = layerContent.height() - topbarHeight - 30; // - carouselHeight;
// define scale
dj.zoomtool.scaleFactorX = (layerWidth / imageWidth);
dj.zoomtool.scaleFactorY = (layerHeight / imageHeight);
dj.zoomtool.scaleFactor = (dj.zoomtool.scaleFactorX < dj.zoomtool.scaleFactorY) ? dj.zoomtool.scaleFactorX : dj.zoomtool.scaleFactorY;
// define offset
dj.zoomtool.orgImgW = imageWidth;
dj.zoomtool.orgImgH = imageHeight;
//var layerRatio = layerHeight / layerWidth;
// set element size
dj.zoomtool.$element.height(layerHeight);
// if wider
//var newImageWidth = 0;
//var newImageHeight = 0;
// if(layerRatio > imageRatio) {
// } else {
// }
// image sizes
currentImage.attr({
'width': imageWidth,
'height': imageHeight
});
// build zoomtool
dj.zoomtool.build();
});
},
build: function () {
var newPosX,
newPosY;
// set min scale
dj.zoomtool.min = dj.zoomtool.scaleFactor;
// append plugins
dj.zoomtool.zoomer = dj.zoomtool.$element.panzoom({
$zoomIn: dj.zoomtool.$overlayer.find('.scale-trigger.zoom-in'),
$zoomOut: dj.zoomtool.$overlayer.find('.scale-trigger.zoom-out'),
minScale: dj.zoomtool.min,
maxScale: dj.zoomtool.max,
onZoom: function (e, g, zoom) {
var zoomPerc = Math.round((zoom - dj.zoomtool.min) / (dj.zoomtool.max - dj.zoomtool.min) * 100);
dj.zoomtool.$slider.slider({
value: zoomPerc
});
}
});
// set initial zoom
newPosX = (dj.zoomtool.orgImgW / 2) - (dj.viewport.w / 2);
newPosY = (dj.zoomtool.orgImgH / 2) - (dj.viewport.h / 2);
// jquery ui slider
dj.zoomtool.$slider.slider({
min: 1,
max: 100,
slide: function (e, ui) {
var focalPoint = {
clientX: (dj.viewport.w / 2),
clientY: (dj.viewport.h / 2)
},
slideValue = (((dj.zoomtool.max - dj.zoomtool.min) * (ui.value - 1) / 100) + dj.zoomtool.min);
dj.zoomtool.zoomer.panzoom('zoom', slideValue, {
silent: true,
focal: focalPoint
});
}
});
// folder plugin
dj.zoomtool.folder = dj.zoomtool.$folder.folder({
headerClass: 'folder__trigger',
contentClass: 'folder__content',
opened: false,
is_built: function (instance, folder) {
// get current slider
var currentSlider = folder.data('Slider');
// if slider not exists
if (!currentSlider) {
// create slider instance
dj.zoomtool.sliderCarousel = dj.zoomtool.$overlayer.find('.list .items').slick({
infinite: false,
variableWidth: true,
swipeToSlide: true,
touchMove: true,
touchThreshold: 10,
prevArrow: '<a class="gallery-action gallery-prev-btn"><i class="icon-arrow-s-b-l"></i></a>',
nextArrow: '<a class="gallery-action gallery-next-btn"><i class="icon-arrow-s-b-r"></i></a>'
});
// append slider instance to folders
folder.data('Slider', dj.zoomtool.sliderCarousel);
}
},
is_opened: function (instance, folder) {
var currentSlider = folder.data('Slider');
// if slider not exists
if (currentSlider) {
currentSlider.slick('setPosition');
}
}
});
// bind mousewheel
dj.zoomtool.$wrap.on('mousewheel.focal', function (e) {
e.preventDefault();
var delta = e.delta || e.originalEvent.wheelDelta,
zoomOut = delta ? delta < 0 : e.originalEvent.deltaY > 0;
dj.zoomtool.zoomer.panzoom('zoom', zoomOut, {
increment: 0.1,
animate: false,
focal: e
});
});
// set alt attribute
dj.zoomtool.$element.find('img').attr('alt', dj.zoomtool.altAttribute);
// added ready class
dj.zoomtool.$overlayer.addClass('loaded');
dj.zoomtool.$element.panzoom("pan", -parseInt(newPosX * dj.zoomtool.scaleFactor, 10), -parseInt(newPosY * dj.zoomtool.scaleFactor, 10), {
relative: false
});
dj.zoomtool.$element.panzoom("zoom", dj.zoomtool.scaleFactor, {
silent: true
});
},
destroy: function () {
// destroy plugins
dj.zoomtool.zoomer.panzoom('destroy');
dj.zoomtool.$slider.slider('destroy');
dj.zoomtool.folder.destroy();
dj.zoomtool.$wrap.off('mousewheel.focal');
if (dj.zoomtool.sliderCarousel) {
dj.zoomtool.sliderCarousel.slick('unslick');
dj.zoomtool.folder.removeData('Slider');
}
// remove styling
dj.zoomtool.$element.attr('style', '');
dj.zoomtool.$overlayer.removeClass('loaded');
// empty containers
dj.zoomtool.$element.find('img').attr({
'src': '',
'style': ''
});
dj.zoomtool.$moreImages.find('.target').html('');
}
}
};
*/
This test page represents the new Zoomer tool implemented on an old non working zoom page.