Ну, наконец-то у меня появилась эта проблема, вот мое решение, и я протестировал его на своем сайте во всех трех основных браузерах: Chrome, Firefox и Internet Explorer.
Прежде всего, если вы не используете текстовый логотип, полностью удалите «navbar-brand», так как я обнаружил, что именно этот класс является основной причиной того, что мое свернутое навигационное меню удвоилось.
Привет пользователю 3137032, чтобы он вел меня в правильном направлении.
Вы должны сделать настраиваемый адаптивный контейнер изображений, я назвал мой «логотипом»
Вот так выглядит HTML-код начальной загрузки:
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="@Url.Action(" Index ", "Home ")" class="logo"><img src="~/resources/images/Logo_Concept.png" /></a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>
<a href="@Url.Action(" About ", "Home ")">
<i class="glyphicon glyphicon-info-sign"></i> About
</a>
</li>
<li>
<a href="@Url.Action(" Contact ", "Home ")">
<i class="glyphicon glyphicon-phone"></i> Contact
</a>
</li>
<li>
<a href="@Url.Action(" Index ", "Products ")">
<i class="glyphicon glyphicon-tag"></i> Products
</a>
</li>
</ul>
</div>
</div>
</div>
И код CSS:
.logo img {
width: 100% \9; /*Force IE10 and below to size SVG images correctly*/
max-width: 100%;
}
@media (max-width:480px) {
.logo img {
width: 70% \9; /*Force IE10 and below to size SVG images correctly*/
max-width: 70% !important;
}
}
@media (max-width:400px) {
.logo img {
width: 75% \9; /*Force IE10 and below to size SVG images correctly*/
max-width: 75%;
}
}
@media (max-width:385px) {
.logo img {
width: 70% \9; /*Force IE10 and below to size SVG images correctly*/
max-width: 70%;
}
}
@media (max-width:345px) {
.logo img {
width: 65% \9; /*Force IE10 and below to size SVG images correctly*/
max-width: 65%;
}
}
@media (max-width:335px) {
.logo img {
width: 60% \9; /*Force IE10 and below to size SVG images correctly*/
max-width: 60%;
}
}
@media (max-width:325px) {
.logo img {
width: 55% \9; /*Force IE10 and below to size SVG images correctly*/
max-width: 55%;
}
}
@media (max-width:315px) {
.logo img {
width: 50% \9; /*Force IE10 and below to size SVG images correctly*/
max-width: 50%;
}
}
Значение в @media (max-width: x) может варьироваться в зависимости от ширины изображений вашего логотипа, у меня это 368px. Процентные доли, возможно, также должны быть изменены в зависимости от размера вашего логотипа. Первый запрос @media должен быть вашим порогом, а мой был шириной изображения (368px) + размер свернутой кнопки (44px) + около 60px, и он достиг 480px, где я начинаю масштабирование адаптивного изображения.
Пожалуйста, не забудьте удалить мой синтаксис бритвы из частей HTML. Дайте мне знать, если это решит вашу проблему, она исправит мою.
Редактировать: Извините, я пропустил вашу проблему с высотой навигационной панели. Есть несколько способов сделать это, лично я скомпилирую Bootstrap LESS с соответствующей высотой панели навигации, для своих целей я использую 70px, а высота моего изображения составляет 68 px. Второй способ сделать это - в самом файле bootstrap.css найти «.navbar» и изменить min-height: на высоту вашего логотипа.
Вы можете сохранить значение, которое вы хотите вернуть из функции, в переменной и вернуть его вне блока транзакции. Например,
def save_with_place_in_set(parent_id)
return_value = false
Category.transaction do
if !save_without_place_in_set
return_value = false
elsif !validate_move parent_id
return_value = false
raise ActiveRecord::Rollback
else
place_in_nested_set parent_id
return_value = true
end
end
return return_value
end
Я изначально установил для return_value значение false, поскольку единственный другой способ выйти из этого блока транзакции - это, если один из других методов вызывает ActiveRecord :: Rollback
Я полагаю.
Поскольку исключение ActiveRecord :: Rollback
обрабатывается, но не вызывается повторно ActiveRecord :: Transaction
, я мог переместить вернуться из блока транзакции и, таким образом, вернуть значение после отката транзакции.
С небольшим рефакторингом:
def save_with_place_in_set(parent_id = nil)
Category.transaction do
return false if !save_without_place_in_set
raise ActiveRecord::Rollback if !validate_move parent_id
place_in_nested_set parent_id
return true
end
return false
end