Switching user agents to access mobile websites

I'm currently using JavaScript to redirect the main website to the mobile website, but I'm struggling to switch back to desktop view on a mobile device.

Is there any way to provide a link labeled "Full Website" that redirects to the main website when clicked on a mobile device?

Below is the JavaScript code I am utilizing:

<script type="text/javascript">// <![CDATA[ 
var mobile = (/iphone|ipad|ipod|android|blackberry|mini|windowssce|palm/i.test(navigator.userAgent.toLowerCase())); 
if (mobile) { 
document.location = "/mobile"; 
} 
// ]]>
</script>

Answer №1

Include this link:

<a href="#" onclick="goToDesktopVersion()">Switch to Desktop Version</a>

Below is the required javascript code (remember to follow the instructions in the comments):

function goToDesktopVersion(){
    // 1.) Set a cookie to indicate preference for desktop version
    // 2.) Redirect window.location to desktop version URL
}

Also, account for the cookie in your detection logic (implement code provided as comments):

function checkIfDeskopVersionCookieIsSet(){
    // Check if the cookie exists and return true or false
}

...

var mobile = ... 
if (mobile && !checkIfDeskopVersionCookieIsSet() ) { 
    document.location = "/mobile"; 
}

The cookie serves the purpose of preventing repeated redirection to the mobile version after selecting the "Switch to Desktop Version" link.

A cookie acts as a small piece of data stored on the user's browser to retain specific information. In this scenario, it signifies the user’s desire to view the desktop version of the site. Cookies facilitate data exchange between server and client, allowing storage on either end. Browser-based cookies can be created using Javascript. To simplify the process of setting a cookie, it is advisable to leverage existing cookie management code snippets.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Modifying CSS files in real-time

I've been attempting to dynamically change the CSS file, but I've run into an issue: Whenever I try to alter the style, it seems to work correctly while in "debug mode", showing that the changes are applied. However, once the JavaScript function ...

`Angular2 - exploring the complexities of function scope`

I'm facing a challenge while working on my Angular2 Sample with the http module. Here is a snippet from my component: app.loginComponent = ng.core.Component({ selector: 'login', templateUrl: 'app/login/login.html&ap ...

Is it possible to read an XML response as a stream using Ext JS?

Requesting an XML response can sometimes result in a slow completion time due to certain constraints. Despite this, the data begins returning quickly. I am wondering if it is feasible to read the response stream in Ext JS before it is fully complete. My u ...

Create a basic search functionality in an Express Node.js application

Recently, I decided to work on a project to enhance my coding skills. I wanted to create a simple search functionality where the URL would be "/search/(parameter here)" and display products whose names match the parameter. After writing a middleware for t ...

Storing information in local storage as JSON using AngularJS

I am working on a form with the following fields: <form ng-submit="addState()"> <input ng-model="text1" type="text"> <input ng-model="text2" type="text"> <input ng-model="text3" type="text"> ...

Unmarshal JSON Data within the Backend

Is it possible to deserialize a JSON string without relying on the Newtonsoft library? I have a string that looks like this: string json = "{status : '1',message : '<tr><th>Date</th><th>Description</th><th&g ...

Why is it not possible to declare an interface or type within a TypeScript class?

I am struggling to define interface | type within a TypeScript class. Here is the code snippet: class MyClass { interface IClass { name: string, id: string } } However, I keep encountering this error: Unexpected token. A constructo ...

Conceal a script-generated div using CSS styling

Using the code below, you can create an HTML chatbox with a link in the top panel and multiple child divs. The structure is as follows: cgroup is the parent of CBG, which is the parent of CGW, and CGW is the parent of the div I want to hide. How can I u ...

Concealing a feature across all pages of the website

I have implemented alert boxes that appear on all pages of the website. Users can individually close each alert box: $(document).ready(function() { $("#close-alert-box-news").click(function() { $("#alert-box-news").hide(800); }); $("#close-al ...

Facing a challenge in configuring MongoDB automatic data expiration based on specific time zones

I am currently facing an issue with clearing data in MongoDB at the start of each day. For example, on July 15, 2020 at 00:00:00, data is deleted from the database based on a specific time. I am having trouble properly assigning the expiresAt attribute in ...

Exporting stylesheets in React allows developers to separate

I am trying to figure out how to create an external stylesheet using MaterialUI's 'makeStyles' and 'createStyles', similar to what can be done in React Native. I'm not sure where to start with this. export const useStyles = m ...

Implementing Next.js with Firebase's onAuthStateChanged method allows seamless user

const checkUserAuth = () => { const [user, setUser] = useState(''); useEffect(() => { auth.onAuthStateChanged(function handleAuth(user) { if (user) { setUser(user); } else { setUser(null); } }) ...

What is the best way to make text appear as if it is floating in Jade or HTML?

Currently, I am facing an issue with a Jade file that displays an error message when a user tries to log in with incorrect credentials. The main problem is that this error message disrupts the alignment of everything else on the page, as it is just a regul ...

Utilizing D3 to fetch geographic data in the form of a TopoJSON file for U.S. counties

After retrieving a set of coordinates, the goal is to use D3 to find the corresponding county from a U.S. TopoJSON file. Here is an example code snippet: navigator.geolocation.getCurrentPosition(function(position) { let coordinates: [number, number] = [p ...

Enhancing D3 visualization with centralized alignment and mobile-friendly responsiveness

I am still quite new to JavaScript and development in general, so I may be overlooking something obvious. Although I have successfully created a chart using d3, I am struggling with positioning. No matter how much I manipulate it with CSS, the chart just d ...

JS Tips for using the .push() function with Multidimensional Arrays in JavaScript

After coming across this code example online, I decided to give it a try. The code snippet involved using the JavaScript array push method to add new elements to an inner sub-array, which was exactly what I needed to achieve! The code successfully demons ...

accessing a webpage using an ionic application

I currently have a responsive website, but I am looking to turn it into an app in order to utilize push notifications. Right now, I am using the inappbrowser plugin to open my website with this code: <a href="#" onclick="window.open('http://www.ex ...

Encountering an 'Unknown provider' error while running a unit test with AngularJS and Jasmine

I am facing an issue while writing a unit test for a controller in my application. Jasmine is showing an 'Unknown provider' error related to a provider I created for fetching template URLs. This provider is injected into a config function that is ...

I'm having trouble getting my accordion menu to work properly. Whenever I click on the question title, the answer doesn't seem to show up or collapse. What could be causing this issue?

I am currently working on a project to create an accordion menu where the answers are hidden and only revealed upon clicking the question. However, when I test it out, nothing happens when I click on the question. Here is my code: .accordion-Section ...

Unveiling the significance behind the utilization of the.reduce() function in conjunction with Object.assign()

After consulting the method/object definitions on MDN, I am attempting to create a simplified step-by-step explanation of how the script below (referenced from a previous post) is functioning. This will not only aid in my understanding but also help me ada ...