Как сделать кнопку на боковой стороне сайта?

Question

Как сделать кнопку на боковой стороне сайта?

/(.*)<FooBar>/s

s вызывает Dot (.) для соответствия возврату каретки

-2

javascript html css

задан dipiu 3 March 2019 в 11:22

2 ответа

Другие вопросы по тегам:

javascript html css

Похожие вопросы:

score 0 · Answer 1

Вы можете использовать свойство position:fixed для исправления вашей кнопки:

.btn{
  position: fixed;
  top: 40px;
  right: 0;
}

<button class="btn">Button</button>

Для темных тему, вы можете добавить .dark имя класса и переключаться на него, например:

$(document).ready(function(){
  $("#changeTheme").click(function(){
    $("body").toggleClass("dark");
  });
});

body{
  background-color: white;
}

.dark{
  background-color: black;
}

.dark .bloc{
  background-color: gray;
}

.dark .bloc p{
  color: white;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body class="light">
  <div class="bloc">
    <p>
      Hello world !<br/>
      <a href="#" id="changeTheme"> Change theme</a>
    </p>
  </div>
</body>

score 0 · Answer 2

Если вам нужно спрятать свою кнопку, вы можете сделать что-то вроде этого.

let $settings = $("#settings");
let $settings__toggle = $("#settings__toggle");

$settings__toggle.on('click', function () {
    $settings.toggleClass("settings_open");
})

.settings {
    top: 20%;
    left: 100%;
    position: fixed;
    transform: translateX(0);
}

.settings.settings_open {
    transform: translateX(-100%);
}

.settings .settings__toggle {
    right: 100%;
    position: absolute;
}

<div id="settings" class="settings">
    <button id="settings__toggle" class="settings__toggle">
        Toggle settings
    </button>
    <div>
        Your Settings
    </div>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>