我正在尝试将文字放在右列和问题(ВОПРОС 1
),(ВОПРОС 2
)等中,这与左栏中的某个特定段落相关,以便提出问题显示在与文本相同的级别(因此直接在其旁边,而不是在其他段落附近)。我该如何实现这样的功能?
// When the user clicks on div, open the popup
function myFunction() {
var popup = document.getElementById("myPopup");
popup.classList.toggle("show");
}
body {
text-align: justify;
text-justify: inter-word;
margin: 0;
}
/* Popup container - can be anything you want */
.popup {
position: relative;
display: inline-block;
cursor: pointer;
color: blue;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
/* The actual popup */
.popup .popuptext {
visibility: hidden;
width: 300px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 8px 0;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -80px;
}
* {
box-sizing: border-box;
}
/* Create two unequal columns that floats next to each other */
.column {
float: left;
padding: 10px;
}
.left {
width: 25%;
}
.right {
width: 75%;
}
/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}
/* Popup arrow */
.popup .popuptext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
}
/* Toggle this class - hide and show the popup */
.popup .show {
visibility: visible;
-webkit-animation: fadeIn 1s;
animation: fadeIn 1s;
}
/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
<body style="text-align:center">
<h2>А. Ф. Керенский. Гатчина</h2>
Издалека́. Сборник статей 1920 – 1921 гг. Париж: 1922
<br></br>
<div class="row">
<div class="column left">
<br></br>
<div class="popup" onclick="myFunction()">(ВОПРОС 1)
<span class="popuptext" id="myPopup">1. Что Керенский имеет в виду, говоря, что ВП боролось с большевиками?</span>
</div>
<div class="popup" onclick="myFunction3()">(ВОПРОС 2)
<span class="popuptext" id="myPopup3">2. В чём Керенский обвиняет соц. партии?</span>
</div>
<div class="popup" onclick="myFunction4()">(ВОПРОС 3)
<span class="popuptext" id="myPopup4">3. Как ВП готовилось к подавлению большевистского мятежа? </span>
</div>
<div class="popup" onclick="myFunction5()">(ВОПРОС 4)
<span class="popuptext" id="myPopup5">4. Какую позицию занял ближайшие помощник Керенского, командующий Петербургского округа полковник Полковников?</span>
</div>
</div>
<div class="column right">
<p style="text-align:justify">
Последний акт борьбы Революционного Временного правительства с большевиками с п р а в а и с л е в а продолжался с 24 октября по 1 ноября 1917 г. Да, я особенно настаиваю на том, что мы боролись сразу на два фронта. И никто никогда не будет в состоянии
опровергнуть ту несомненную связь, которая существовала между большевистским восстанием и усилиями реакции свергнуть Временное правительство и повернуть государственный корабль вспять к берегу социальной реакции.
<br></br>
После безуспешной для заговорщиков и столь несчастной для государства попытки свергнуть Временное правительство вооруженной рукой ген. Корнилова общественные группы, поддержавшие «диктатора» и связанные с ним, постановили не оказывать правительству в
случае столкновения его с большевиками никакой помощи. Их стратегический план состоял в том, чтобы сначала не препятствовать успеху вооруженного восстания большевиков, а затем, после падения ненавистного Временного правительства, быстро подавить
большевистский «бунт». Таким образом должны были быть достигнуты, наконец, цели, поставленные Корниловскому восстанию.
</p>
<p style="text-align:justify">
Военные и штатские стратеги, авторы этого замечательного плана, были твердо убеждены в том, что большевистский триумф не представит из себя никакой серьезной опасности и что через 3 - 4 недели «здоровые элементы» русского народа справятся с бунтующей
массой и установят в России «сильную власть». Увы, выполнив блестяще первую, так сказать, пассивную часть своего плана - «свергнув» руками большевиков Временное правительство, наши «патриоты» оказались совершенно не способными победить большевиков
не только в три месяца,
<div class="popup" onclick="myFunction2()">но и в три года!..<span class="popuptext" id="myPopup2">Керенский имеет виду Гражданскую войну, которая уже продолжалась три года на момент написания этой статьи в 1920 г. </span>
</div>
<br></br>
</p>
<p style="text-align:justify">
Около 20 октября начали большевики осуществлять в Петербурге свой план вооруженного восстания для свержения Временного правительства во имя «мира, хлеба и скорейшего созыва Учредительного собрания». Эта подготовка шла довольно успешно, в частности и потому,
что остальные социалистические партии и советские группировки, относясь ко всем сведениям о готовящихся событиях как к «контрреволюционным измышлениям», даже не пытались своевременно мобилизовать свои силы, способные в нужный момент оказать сопротивление
большевистским затеям, так сказать, внутри самой «революционной демократии». Со своей стороны, правительство готовилось к подавлению мятежа, но, не рассчитывая на окончательно деморализованный корниловской авантюрой гарнизон Петербурга, изыскивало
другие средства воздействия. По моему приказу с фронта должны были в срочном порядке выслать в Петербург войска и первые эшелоны с Северного фронта должны были появиться в столице 24 октября.
<br></br>
</p>
<p style="text-align:justify">
В то же время
<div class="popup" onclick="myFunction6()"> полк. Полковников <span class="popuptext" id="myPopup6"> Гео́ргий Петро́вич Полко́вников (1883-1918) — российский военный деятель, главнокомандующий Петроградским военным округом в сентябре — октябре 1917 года, последнее воинское звание — полковник. </span>
</div>, командующий войсками Петербургского военного округа, получил приказ разработать подробный план подавления мятежа. Ему же было предложено своевременно взять на учет, организовать все верные долгу части того же гарнизона. Полк. Полковников
каждое утро лично представлял мне ра́порт, причем постоянно докладывал, что во вверенных ему войсках, которыми может располагать правительство, «вполне достаточно» сил для того, чтобы справиться с готовящимся восстанием. К великому сожалению,
мы, члены правительства, слишком поздно узнали, что как сам Полковников, так и часть его штаба вели в эти роковые дни д в о й н у ю и г р у и примыкали как раз к той части офицерства, в планы которой входило свержение Временного правительства
руками большевиков.
</p>
</div>
</div>
</body>
</html>
答案 0 :(得分:0)
您可以在<a></a>
中添加标签<div class="popup">
,这将使用段落的ID,并会在此段落中显示您的答案。
<a href="#click"><div class="popup" onclick="myFunction()">(ВОПРОС 1)
<span class="popuptext" id="myPopup">1. Что Керенский имеет в виду, говоря, что ВП боролось с большевиками?</span>
</div></a>
<p id="click">
your paragraph
</p>
我建议你一个想法:
如果您希望用户关注段落,您可以通过单击更改此段落的背景颜色。
<script>
function changeColor(id)
{
document.getElementById(id).style.backgroundColor = "#ff0000"; // backcolor
}
</script>
<div id="myid">Hello There !!</div>
<a href="#" onclick="changeColor('myid'); return false;">Change Color</a>