Изучаю HTML and CSS, JS будет в будущем (про существование Jquery знаю). Подскажите в чем может быть проблема. Заготовки (checkbox+menu и checkbox+image) по отдельности "работают",
<style>
input{
position:fixed;
right:5px;
cursor: pointer;
-webkit-transition: all 0.7s;
-moz-transition: all 0.7s;
-o-transition: all 0.7s;
-ms-transition: all 0.7s;
transition: all 0.7s;
}
label{
position: fixed;
right:0px;
width:0px;
background:rgba(232, 67, 46, 0.45);
border:1px solid red;
-webkit-transition: all 0.7s;
-moz-transition: all 0.7s;
-o-transition: all 0.7s;
-ms-transition: all 0.7s;
transition: all 0.7s;
}
input:checked {
right:210px;
}
input:checked + label {
width:210px;
}
</style>
</head>
<body>
<input type="checkbox">
<label id="menu">dddddddddddddddddddddddddddddddddddddddddddd</label>
</body>
а в сборе checkbox-image-button плавает, а меню не "выплывает".
<style>
input{
position:fixed;
right:5px;
z-index: 1;
margin: 0;
padding: 0;
height: 32px;
width: 30px;
background: #eee url(b_plus.png);
cursor: pointer;
opacity:1;
-webkit-transition: all 0.7s;
-moz-transition: all 0.7s;
-o-transition: all 0.7s;
-ms-transition: all 0.7s;
transition: all 0.7s;
}
#plus {
position:fixed;
right:5px;
width:30px;
height:30px;
background: #eee url(b_minus.png);
border:1px solid red;
-webkit-transition: all 0.7s;
-moz-transition: all 0.7s;
-o-transition: all 0.7s;
-ms-transition: all 0.7s;
transition: all 0.7s;
}
label {
position: fixed;
right:0px;
width:0px;
background:rgba(232, 67, 46, 0.45);
border:1px solid red;
-webkit-transition: all 0.7s;
-moz-transition: all 0.7s;
-o-transition: all 0.7s;
-ms-transition: all 0.7s;
transition: all 0.7s;
}
input:checked {
right:210px;
}
input:checked + #plus {
right:210px;
}
input:checked + label {
width:210px;
}
</style>
<body>
<input type="checkbox">
<img id="plus">
<label class="menu">dddddddddddddddddddddddddddddddddddddddddddd</label>
</body>
Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
|