Skip to main content
Microsoft
Surface Duo
Surface Duo
  • Home
  • DevBlogs
    • Visual Studio
    • Visual Studio Code
    • Visual Studio for Mac
    • DevOps
    • Developer support
    • CSE Developer
    • Engineering@Microsoft
    • Azure SDK
    • IoT
    • Command Line
    • Perf and Diagnostics
    • Dr. International
    • Notification Hubs
    • Math in Office
    • DirectX
    • PIX
    • SurfaceDuo
    • Startups
    • Sustainable Engineering
    • Windows AI Platform
    • C++
    • C#
    • F#
    • Visual Basic
    • TypeScript
    • PowerShell Community
    • PowerShell Team
    • Python
    • Q#
    • JavaScript
    • Java
    • Java Blog in Chinese
    • .NET
    • .NET MAUI
    • Blazor
    • ASP.NET
    • NuGet
    • Xamarin
    • #ifdef Windows
    • Apps for Windows
    • Azure Depth Platform
    • Azure Government
    • Bing Dev Center
    • Microsoft Edge Dev
    • Microsoft Azure
    • Microsoft 365 Developer
    • Old New Thing
    • Windows MIDI and Music dev
    • Windows Search Platform
    • Azure Cosmos DB
    • Azure Data Studio
    • Azure SQL Database
    • OData
    • Revolutions R
    • SQL Server Data Tools

    Surface Duo Blog

    web - Surface Duo Blog

    Microsoft Edge dual-screen web APIs
    Microsoft Edge dual-screen web APIs
    March 10, 2022 Mar 10, 2022 03/10/22
    Craig Dunn
    Hello dual-screen web developers! Microsoft Edge version 97 included the dual-screen web APIs that have been in preview since last year. Now Microsoft Surface Duo users with the latest Edge will get an enhanced web experience automatically when sites have implemented the CSS or JavaScript dual-screen APIs. Visit the dual-screen web ...

    Comments are closed.0cssJavaScriptSurface Duo
    Foldable CSS and JavaScript update for web developers
    Foldable CSS and JavaScript update for web developers
    November 24, 2021 Nov 24, 2021 11/24/21
    Craig Dunn
    Hello web developers! The dual-screen CSS and JavaScript enhancements for Microsoft Edge were initially shared in June 2020 when they were first available behind a feature flag for testing. Since then there has been a lot of work and feedback on the proposals, and the implementation currently available in the latest version of ...

    Comments are closed.0designJavaScriptSurface Duo
    Surface Duo at Microsoft Build
    Surface Duo at Microsoft Build
    May 25, 2021 May 25, 2021 05/25/21
    Guy Merin
    Hello developers! Microsoft Build starts today with a keynote by Satya Nadella. The session catalog includes several Microsoft Surface sessions for developers looking to enhance their mobile applications for Surface Duo. Join the Surface Duo Developer Experience team in a mix of live and on-demand sessions that will help you build amazing ...

    Comments are closed.0cssJavaScriptJetpack Window Manager
    Build and deploy dual-screen progressive web apps
    Build and deploy dual-screen progressive web apps
    April 15, 2021 Apr 15, 2021 04/15/21
    Justin Willis
    Hello web developers, We've posted previously about using dual-screen media queries and JavaScript to adapt web apps for Microsoft Surface Duo. Today’s post is about how you can use those dual-screen capabilities in your progressive web app (PWA) and deploy to both the Google Play Store AND the Microsoft Store using PWABuilder! We...

    Comments are closed.0JavaScriptProgress Web Appsweb
    Adapting your Angular web app for dual-screen devices
    Adapting your Angular web app for dual-screen devices
    April 1, 2021 Apr 1, 2021 04/1/21
    Yohan Lasorsa
    Hello web developers! Foldable and dual-screen devices are becoming increasingly more common over time, but you may wonder if investing development time to support these devices might be worth it, especially when creating fully responsive web apps is already a challenge. Using the new CSS and JavaScript primitives is a fun way to ...

    Comments are closed.0AngularcssJavaScript
    Building dual-screen web experiences with React
    Building dual-screen web experiences with React
    January 21, 2021 Jan 21, 2021 01/21/21
    Aaron Powell
    Hello web developers! Responsive design has always been the cornerstone of web development, rather than designing for a single use case, we focus on creating applications that can adjust to the needs of the platform they are running on. Microsoft Surface Duo is no exception to this and in past blog posts we’ve explored how we can use ...

    Comments are closed.0JavaScriptReactSurface Duo
    Build dual-screen Cordova apps for Microsoft Surface Duo
    Build dual-screen Cordova apps for Microsoft Surface Duo
    December 17, 2020 Dec 17, 2020 12/17/20
    Craig Dunn
    Hello hybrid app developers, This week I’m happy to share an example plugin for use with Cordova that will help to enhance your hybrid apps for dual-screens. The plugin includes DisplayMask.jar to detect the Surface Duo and return information about the masked hinge area when the app is spanned, and exposes it in JavaScript for ...

    Comments are closed.0CordovaDual Screen Developmenthybrid
    Adapting your website to support new possibilities of dual-screen devices
    Adapting your website to support new possibilities of dual-screen devices
    October 15, 2020 Oct 15, 2020 10/15/20
    Alexis Menard (Intel)
    Hello there, fellow web developers! In an earlier blog post, we introduced the upcoming CSS @media feature primitives and the getWindowSegments() API for dual-screen and foldable devices. In this blog post, we will look at how Kenneth Rohde Christiansen and myself created and adapted our existing Foldship demo to take ...

    Comments are closed.0cssDual Screen DevelopmentJavaScript
    Launch your dual-screen enhanced website today with Microsoft Edge Origin Trials
    Launch your dual-screen enhanced website today with Microsoft Edge Origin Trials
    September 24, 2020 Sep 24, 2020 09/24/20
    Craig Dunn
    Hello dual-screen web developers! Earlier this month, we shared details on how you can build dual-screen web apps using the web APIs built-in to Microsoft Edge and Chrome. The Microsoft Edge team followed up with a more detailed explanation of the CSS and JavaScript APIs. These APIs are still in preview and require you to enable ...

    1cssJavaScriptweb
    Build and test dual-screen web apps
    Build and test dual-screen web apps
    September 3, 2020 Sep 3, 2020 09/3/20
    Craig Dunn
    Hello dual-screen web developers! In a previous blog post, we talked about the dual-screen CSS @media primitives and the getWindowSegments() API, and how they could be tested with polyfill extensions. Now those features are built-in to Microsoft Edge and Chrome™ browser canary builds, ready for developers to begin building dual-...

    Comments are closed.0cssJavaScriptSurface Duo
    • Page 1
    • Page 2
    • Next page
    Relevant Links
    Top Bloggers

    Craig Dunn
    Principal SW Engineer

    Kristen Halper
    SW/FW Engineer

    Cesar Valiente
    Senior Software Engineer

    Guy Merin
    Senior Director of Engineering

    Mehul Shah
    UX Designer

    Topics
  • Surface Duo SDK
  • Surface Duo Design
  • Stay informed

    Login
    Code Block
    What's new
    • Surface Pro 8
    • Surface Laptop Studio
    • Surface Pro X
    • Surface Go 3
    • Surface Duo 2
    • Surface Pro 7+
    • Windows 11 apps
    • HoloLens 2
    Microsoft Store
    • Account profile
    • Download Center
    • Microsoft Store support
    • Returns
    • Order tracking
    • Virtual workshops and training
    • Microsoft Store Promise
    • Flexible Payments
    Education
    • Microsoft in education
    • Devices for education
    • Microsoft Teams for Education
    • Microsoft 365 Education
    • Education consultation appointment
    • Educator training and development
    • Deals for students and parents
    • Azure for students
    Business
    • Microsoft Cloud
    • Microsoft Security
    • Azure
    • Dynamics 365
    • Microsoft 365
    • Microsoft Advertising
    • Microsoft Industry
    • Microsoft Teams
    Developer & IT
    • Developer Center
    • Documentation
    • Microsoft Learn
    • Microsoft Tech Community
    • Azure Marketplace
    • AppSource
    • Microsoft Power Platform
    • Visual Studio
    Company
    • Careers
    • About Microsoft
    • Company news
    • Privacy at Microsoft
    • Investors
    • Diversity and inclusion
    • Accessibility
    • Security
    English (United States)
    • Sitemap
    • Contact Microsoft
    • Privacy
    • Manage cookies
    • Terms of use
    • Trademarks
    • Safety & eco
    • About our ads
    • © Microsoft 2022