Как сделать так, чтобы веб-страница открывалась в палитре цветов? - PullRequest
Новая
       38

Как сделать так, чтобы веб-страница открывалась в палитре цветов?

0 голосов
/ 09 июля 2019

Я пытаюсь открыть другую веб-страницу в виде colorbox, но я не могу понять это.

Ниже приведена веб-страница, которую я хочу открыть, когда человек нажимает на изображение. 

<div class="album py-5">
  <div class="container">
    <div class="row">
      <div id="projects" class="col-md-8 col-lg-6 shadow-sm">
        <a href="project1.html" id="yourlink"><img class="img-fluid" src="img/mockup.png" alt="iPhone Mockup">
        </a>
      </div>
    </div>
  </div>
</div>

Ниже приведен скрипт, который я сделал. 

<script>
  "use strict";
  $(document).ready(function(){
    $('#yourlink').colorbox();
  });
</script>

Я впервые пытаюсь использовать colorbox, так что это немного сбивает с толку, спасибо.

1 Ответ

0 голосов
/ 09 июля 2019

colorbox имеет атрибут конфигурации, называемый "html", где вы можете предоставить html-код для его отображения. Например: 

var code = $('div.py-5').html();
$('#yourlink').colorbox({html: code});

Если вы можете изменить HTML, чтобы показать, вы также можете проверить примеры colorbox, поскольку они включают встроенный пример HTML.

Редактировать: Вот рабочий пример: 

var button = $("#clickme");

$(document).ready(function() {
	var code = $("#myContent").html();
	$("#clickme").colorbox({ "html": code })
});
#myContent {
  display: none;
}
<!DOCTYPE html>
<html>
	<head>
		<meta charset='utf-8'/>
		<title>Colorbox Examples</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://www.jacklmoore.com/colorbox/jquery.colorbox.js"></script>
    <style rel="https://www.jacklmoore.com/colorbox/example1/colorbox.css"></style>
  </head>
  <body>
    <div id="myContent">
      <p>Hello World from the content.</p>
    </div>
    
    <a href="#none" id="clickme">Click me</a>
 </body>
</html>
...