Быстрый просмотр карточки квартиры

[Victor_winner 2]

Такой вопрос. Когда клиент открывает карточку квартиры, чтобы добраться до неё, ему нужно прокрутить логотип, меню и два слайдера  . Тем более на мобильных устройствах это неудобно. Как сделать так, что при нажатии на квартиру  ,

открывалась новая страничка с карточкой квартиры и анимационно (наверно jQuery), переход был сразу на карточку . 

 

[abushyk 694]

1. Файл /template/frontend/realty/realty_view.tpl в принципе для любого практически шаблона realty_view.tpl

Находим в разметке место, где "как бы начинается" карточка.

Ставим в это место метку

<a name="startrealtyview"></a>

2. Открываем шаблоны отчечающие за вывод сеток. Обычно это 

/template/frontend/realty/realty_grid.tpl

/template/frontend/realty/realty_grid_list.tpl

/template/frontend/realty/realty_grid_tumbs.tpl

Тут все зависит от компоновки шаблона.

В каждом из этих файлов находим {$grid_items.href} и меняем на 

{$grid_items[i].href}#startrealtyview

Он там часто встречается - в ссылка на картинках, в ссылка на текстах, в событиях onClick. Так что придется попотеть.

[abushyk 694]

Вариант 2. (UPD)

 

1. Ставим метку в realty_view.tpl , где "как бы начинается" карточка. Метка не такая как в предыдущем примере

<span id="startrealtyview"></span>

2. В этом же файле добавляем код

 

{literal}<script>$(document).ready(function(){$('body').scrollTop($('#startrealtyview').offset().top);});</script>{/literal}

[Realtor 47]

а можно ли еще решить как реализовано в админке в сетке объявлений - как всплывающая подсказка "Информация о пользователе", также на главной в сетке объявлений при наведении курсора мыши на объявление всплывала подсказка - краткая информация с описанием и телефоном подателя объявления и ссылкой внутри в Избранное и Подробнее, при нажатии на которой выходило новое окно realty_view.tpl
Было бы удобно и сократило бы время всем пользователям сайта на просмотр нужной информации

[TopRaN 235]

В бутстрап есть такая функция popover (вспомогательный экран)

вот она и помогает сделать информационный блок 

http://bootstrap-3.ru/javascript.html#tooltips

[Realtor 47]

В бутстрап есть такая функция popover (вспомогательный экран)

вот она и помогает сделать информационный блок 

http://bootstrap-3.ru/javascript.html#tooltips

Помогли бы расписать на примере, по крайней мере я был бы признателен

[TopRaN 235]

Помогли бы расписать на примере, по крайней мере я был бы признателен

Я понимаю, что вам хочется иметь код который можно просто вставить и запустить. То что Вы хотите ни как не относится к основным функциям сайтбилла - это дополнение , так сказать приятная фишка для украшения. и я так полагаю что ни мне ни разработчикам не хотелось бы терять на этом дополнительный заработок. Поэтому на будущее формулируйте вопросы связанные с решением именно на доработку или устранение каких-либо неисправностей, а не украшения.

в header.tpl  вставьте код 

<script type="text/javascript">

$(document).ready(function(){

    $('#example1').popover({placement:  'top'});

    $('#example2').popover({placement:  'right'});

</script>

 

после вставьте код там где вы хотите (для эксперемента поставьте перед таблицей или в футоре)

<a class="btn btn-success btn-small" id="example1" rel="popover" data-content=" Контент" data-original-title="Изменить параметры позиции">Изменить</a>

<a class="btn btn-success btn-small" id="example2" rel="popover" data-content=" Контент" data-original-title="Изменить параметры позиции">Изменить</a>

 

в принципе все. 

Это только пример, который будет работать с двумя ссылками, остальное додумаете.

[Realtor 47]

Почему то Ваш пример не сработал. Выдал кучу ошибок на

в header.tpl вставьте код

<script type="text/javascript">
$(document).ready(function(){
$('#example1').popover({placement: 'top'});
$('#example2').popover({placement: 'right'});
</script>

[TopRaN 235]

Почему то Ваш пример не сработал. Выдал кучу ошибок на

в header.tpl вставьте код

<script type="text/javascript">

$(document).ready(function(){

$('#example1').popover({placement: 'top'});

$('#example2').popover({placement: 'right'});

</script>

lдобавте });

<script type="text/javascript">

$(document).ready(function(){

$('#example1').popover({placement: 'top'});

$('#example2').popover({placement: 'right'});

});

</script>

[Realtor 47]

{literal}

 

<script type="text/javascript">
$(document).ready(function(){
$('#example1').popover({placement: 'top'});
$('#example2').popover({placement: 'right'});

});

</script>

{/literal}

[Victor_winner 2]

Abyshuk - огромное Вам спасибо за своевременную и квалифицированную помощь. Всё заработало!  http://amur-n.ru/prodaja-kvartir/realty15

[doma 22]

В 10.02.2014 в 10:40, TopRaN сказал:

Я понимаю, что вам хочется иметь код который можно просто вставить и запустить. То что Вы хотите ни как не относится к основным функциям сайтбилла - это дополнение , так сказать приятная фишка для украшения. и я так полагаю что ни мне ни разработчикам не хотелось бы терять на этом дополнительный заработок. Поэтому на будущее формулируйте вопросы связанные с решением именно на доработку или устранение каких-либо неисправностей, а не украшения.

в header.tpl  вставьте код 

<script type="text/javascript">

$(document).ready(function(){

    $('#example1').popover({placement:  'top'});

    $('#example2').popover({placement:  'right'});

</script>

 

после вставьте код там где вы хотите (для эксперемента поставьте перед таблицей или в футоре)

<a class="btn btn-success btn-small" id="example1" rel="popover" data-content=" Контент" data-original-title="Изменить параметры позиции">Изменить</a>

<a class="btn btn-success btn-small" id="example2" rel="popover" data-content=" Контент" data-original-title="Изменить параметры позиции">Изменить</a>

 

в принципе все. 

Это только пример, который будет работать с двумя ссылками, остальное додумаете.

подскажите а почему аналогичное не работает с всплывающими подсказками ?
или надо что то отдельно подключать ?
Что делаем не правильно? тоже самое прописываем в header но ничего не работает -красивых подсказок так и не получается сделать при наведении на кнопку или просто ссылку

в header пишем 
{literal}
<script type="text/javascript">
    $(document).ready(function(){
    $('#example1').tooltip({placement: 'top'});
    $('#example2').popover({placement: 'right'});
  });
</script>
{/literal}

а вот где кнопки уже так 

 <a class="btn btn-success btn-small" id="example1" rel="tooltip" data-toggle="tooltip" data-placement="top" title="подсказка сверху">пример 1</a>

<a class="btn btn-success btn-small" id="example2" rel="popover" data-placement="top" data-original-title="контент сверху" data-content="Контент снизу">пример 2</a>

но ни каких толковых подсказок не появляется, появляется подсказка но на всю ширину экрана лишь

шаблон реалия

[TopRaN 235]

1 час назад, doma сказал:

поднаажите а почему аналогичное не работает с всплывающими подсказками ?
или надо что то отдельно подключать ?
Что делаем не правильно? тоже самое прописываем в header но ничего не работает -красивых подсказок так и не получается сделать при наведении на кнопку или просто ссылку

в header пишем 
{literal}
<script type="text/javascript">
    $(document).ready(function(){
    $('#example1').tooltip({placement: 'top'});
    $('#example2').popover({placement: 'right'});
  });
</script>
{/literal}

а вот где кнопки уже так 

 <a class="btn btn-success btn-small" id="example1" rel="tooltip" data-toggle="tooltip" data-placement="top" title="подсказка сверху">пример 1</a>

<a class="btn btn-success btn-small" id="example2" rel="popover" data-placement="top" data-original-title="контент сверху" data-content="Контент снизу">пример 2</a>

но ни каких толковых подсказок не появляется, появляется подсказка но на всю ширину экрана лишь

шаблон реалия

Потому что пример был для шаблоНа на третьей версии бутстрапа А реалия Сделана на версии второй.

[doma 22]

2 часа назад, TopRaN сказал:

Потому что пример был для шаблоНа на третьей версии бутстрапа А реалия Сделана на версии второй.

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

 

outube.com/watch?v=iAtavPHzXbQ  вставить y
ootstrap-ru.com/204/assets/js/bootstrap-tooltip.js вставить b
ybootstrap.ru/javascripts/#tooltips вставит m

если взять файл в шаблоне реалия bootstrap.css
то строка примерно 5317 и ниже говорит и описывает

.tooltip {
  position: absolute;
  z-index: 1030;
  display: block;
  font-size: 11px;
  line-height: 1.4;
  opacity: 0;
  filter: alpha(opacity=0);
  visibility: visible;
}

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

Спасибо

 

[doma 22]

4 часа назад, TopRaN сказал:

Потому что пример был для шаблоНа на третьей версии бутстрапа А реалия Сделана на версии второй.

есть интересный настраиваемый пример  тут - но это не совсем то, и это самописное решение а не встроенное в бустрап, тут есть минус то что если текст будет длинны или короткий -то есть не контролируемый, придется постоянно изменять ширину и высоту полю, поскольку это не удобно -не очень оличное решение

 

[doma 22]

подскажите а что не так с работой подсказок . Чтобы заработали подсказки непосредственно на странице объявки например необходимо поместить скрипт
<script type="text/javascript" src="{$estate_folder}/template/frontend/{$current_theme_name}/js/bootstrap.min.js"></script>
и далее скрипт 

если его не поместить то всплывающие подсказки  не показываются, а если поставить то работает.

непонятка в том что данный скрипт есть уже в header.tpl - вероятнее он там eже подключается? тогда почему не работает ? и почему работает если его засунуть в realtyview ?
шаблон реалия версия бутстрапа 2

[TopRaN 235]

2 часа назад, doma сказал:

подскажите а что не так с работой подсказок . Чтобы заработали подсказки непосредственно на странице объявки например необходимо поместить скрипт
<script type="text/javascript" src="{$estate_folder}/template/frontend/{$current_theme_name}/js/bootstrap.min.js"></script>
и далее скрипт 

если его не поместить то всплывающие подсказки  не показываются, а если поставить то работает.

непонятка в том что данный скрипт есть уже в header.tpl - вероятнее он там eже подключается? тогда почему не работает ? и почему работает если его засунуть в realtyview ?
шаблон реалия версия бутстрапа 2

http://getbootstrap.com/2.3.2/javascript.html#tooltips

А где у вас активация данных подсказок на элементе?

[doma 22]

7 часов назад, TopRaN сказал:

http://getbootstrap.com/2.3.2/javascript.html#tooltips

А где у вас активация данных подсказок на элементе?

как понять активация?
если вы вы про это  - то вот, на ссылке типа <a> идет активация
<a href="#" data-toggle="tooltip" data-placement="left" title="Что-то не сработало?">Наведите курсор</a>

но перед этим идет еще скрипт 
<script>
  $(document).ready (function (){
    $('[data-toggle="tooltip"]').tooltip ();
  });
</script>

[doma 22]

Подскажите а как все же сделать подсказки в бутстрап 2 на шаблоне реалия?


столкнулись с такой проблемой что если в карточке объявления добавить скрипт 
<script type="text/javascript" src="{$estate_folder}/template/frontend/{$current_theme_name}/js/bootstrap.min.js"></script>
то отлично работают подсказки. но при этом почему то не корректно работают модальные окна  -они при этом при клике открываются на доли секунды и сразу закрываются, и после этого вообще черный экран.

И странное поведение еще такое, что данный скрипт уже есть в HEADER. но почему то в карточке если просто вставить

<script>
  $(document).ready (function (){
    $('[data-toggle="tooltip"]').tooltip ();
  });
</script>

и например 
<a title="текст подсказки" data-toggle="tooltip"  href="/" class="btn btn-success">удалить</a>
то подсказки не работают.

 

а вот если все же поставить и написать так то одно работает а другое не работает (по принципу описанному сверху)

<script type="text/javascript" src="{$estate_folder}/template/frontend/{$current_theme_name}/js/bootstrap.min.js"></script>
<script>
  $(document).ready (function (){
    $('[data-toggle="tooltip"]').tooltip ();
  });
</script>
<a title="текст подсказки" data-toggle="tooltip"  href="/" class="btn btn-success">удалить</a>

как быть ? и что не так?
 

[TopRaN 235]

7 часов назад, doma сказал:

как быть ? и что не так?

А сам скрипт обернут в {literal} ?

[doma 22]

Только что, TopRaN сказал:

А сам скрипт обернут в {literal} ?

Да конечно пробовали и с литерал и без него, однако не совсем корректно работает.

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

[TopRaN 235]

В 07.08.2017 в 15:47, doma сказал:

Подскажите а как все же сделать подсказки в бутстрап 2 на шаблоне реалия?

Начнем с того что для второй версии нужен jquery до версии 2.0 . проблема в том, что в 2 версии нет 'on'

Вариант № 1.

пишем ссылку 

<a href="#" rel="tooltip" data-placement="top" data-original-title="Tooltip on top">Tooltip on top</a>

скрипт

<script type="text/javascript">
  {literal}
     $(document).ready(function (){
        $("[rel='tooltip']").tooltip();
    });
  {/literal}
</script>

Вариант №2 ( путем добавления ID), работает только для одной конкретной ссылки, но ID можно заменить на класс.

ссылка 

<a href="#" rel="tooltip" title="first tooltip first tooltip" id="example">tooltip</a>

стили

.tooltip-inner {
    white-space:pre;
    max-width: none;
}

скрипт

<script type="text/javascript">
  {literal}
     $(document).ready(function (){
        $('#example').tooltip();
    });
  {/literal}
</script>

 

[doma 22]

Только что, TopRaN сказал:

Начнем с того что для второй версии нужен jquery до версии 2.0 . проблема в том, что в 2 версии нет 'on'

пишем ссылку 

<a href="#" rel="tooltip" data-placement="top" data-original-title="Tooltip on top">Tooltip on top</a>

скрипт

<script type="text/javascript">
  {literal}
     $(document).ready(function (){
        $("[rel='tooltip']").tooltip();
    });
  {/literal}
</script>

 

если не закачивать jquery 2,0 то тот скрипт который вы написали мы пробовали, только вот немного иной -или может вы сами ошиблись - поскольку литерал написано у вас внутри script а мы писали за ним то есть 
литерал
скрипт
конецскрипта
конецлитерал

[doma 22]

и что все же нужно написать кроме скрипта чтобы на бутстрап версиии 2 и шабоне реалия одновременно работали и подсказки и модальные окна :)) ?

[TopRaN 235]

2 минуты назад, doma сказал:

и что все же нужно написать кроме скрипта чтобы на бутстрап версиии 2 и шабоне реалия одновременно работали и подсказки и модальные окна :)) ?

Модальные окна у вас и так работают. иначе у вас не открывалось окно для авторизации и регистрации.