Question: I am designing a responsive webapp using Bootstrap. Of course the XS-Screen has fewer options than the LG-Screen. 
For specialized users, there should be a button to switch to 'Classic/Desktop-View' even if a XS-Smartphone is currently used. (JavaScript to set a virtual viewport size?)

Example: a user on a 320px device can click a button to switch the Html to display the content as if the screen was 1024px wide and scroll around.

How can this be achieved?

Answer: 
You have to add Meta Tag.

```
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

```

Refer: <http://getbootstrap.com/css/#overview-mobile>

### What is Meta element?

Meta element represents any metadata information that cannot be represented by one of the other HTML meta-related elements and Depending on the attributes set

1. name
2. http-equiv
3. charset
4. itemprop

Refer:  

<https://developer.mozilla.org/en/docs/Web/HTML/Element/meta>  

<https://www.w3.org/wiki/HTML/Elements/meta>
Now I found a solution based on @Venkatraman's response and <https://stackoverflow.com/a/22407322/532272> 
The important thing is, that a virtual viewport setting is ignored by browser's responsive design tools. You have to test using an actual mobile device. 

Here's the code:

### JavaScript:

```
this.switch2Desktop = function (width) {
    var viewportParam = "viewport=" + width;
    var currentUrlWithoutViewportParam = window.location.href.replace(/[\?\&]+viewport\=\d+/g, '');
    if (currentUrlWithoutViewportParam.contains("?")) {
        window.location.href = currentUrlWithoutViewportParam + "&" + viewportParam;
    } else {
        window.location.href = currentUrlWithoutViewportParam + "?" + viewportParam;
    }
};  

$("#desktopSwitchLink").click(function () {
    responsiveFeatures.switch2Desktop("1024");
});
$("#defaultSwitchLink").click(function () {
    responsiveFeatures.switch2Desktop("0");
});

```

### JSP:

```
<c:choose>
    <c:when test="${param.viewport == '0'}">
        <c:remove var="viewport" scope="session"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    </c:when>
    <c:when test="${not empty sessionScope.viewport || (not empty param.viewport and param.viewport != '0')}">
        <c:if test="${not empty param.viewport}">
            <c:set var="viewport" value="${param.viewport}" scope="session"/>
        </c:if>
        <meta name="viewport" content="width=${sessionScope.viewport}" />
    </c:when>
    <c:otherwise>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    </c:otherwise>
</c:choose>

```