Enable/Load and Disable CSS using jQuery

Enable/Load and Disable CSS using jQuery

| |
Image Carousel

Table of Contents

S.no Contents-topics
1 Enabe and disable css using jQuery

1:Enable and disable CSS using jQuery

Sometimes when we are working on a project where we have to work with two different themes like one is Dark Mode and other one is Light Mode , so what options we have * we may load the page using JS but that one seems to be old method to do that functionality .

So we do toggle the theme or we may say that load the css using jquery or enable and disable the css using jQuery.
HTML code :

<!DOCTYPE html>
<html lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Developer Corner</title>
    <!-- CSS only -->
    <link id="darkTheme" href="https://vm-services.tech/developerCorner/css/changeDark.css" disabled="disabled" rel="stylesheet" />
    <link id="lightTheme" href="https://vm-services.tech/developerCorner/css/changeWhite.css" rel="stylesheet" />
    <!-- Js -->
    <script src="https://code.jquery.com/jquery-3.6.1.min.js" crossorigin="anonymous"></script>
   <h3>Hello Developer</h3>
  <div id="changeTheme"><button onclick="changeMyCss('dark')">click for Dark Mode</button></div>
    function changeMyCss(theme)
        var html = '';
        if(theme == 'dark'){
            $('#lightTheme').attr('disabled', 'disabled');
            html+='<button onclick="changeMyCss(\'light\')">click for Light Mode</button>';
            $('#darkTheme').attr('disabled', 'disabled');
            html+='<button onclick="changeMyCss(\'dark\')">click for Dark Mode</button>';


Tags: how to load and disable css using jquery , how to enable and disable css using jquery , light theme and dark theme using jquery,jquery , advance jquery , jquery advance code,
0 Comments (Please let us know your query)
Leave Comment
Leave Comment
Articles from other Categories
Load More