Плавный якорь из меню на Jquery

  • 19 Ответов
  • 1376 Просмотров

0 Пользователей и 1 Гость просматривают эту тему.

*

Оффлайн Timerlan

Всем привет) как сделать ссылку якорь из главного меню, и чтобы шло плавно через Jquery. на Joomla 1/5

у меня получилось только в статье стандартными средствами редактора JCE он создает такой вот код (якорь)<p><a id="rey"></a> (ссылка на якорь) <p><a href="#rey">ТЕКСТ</a>
но все происходит резко, хотя на другом сайте все происходит плавно, я не профи но думаю что это както связанно с Jquery,
В общем, объясните ктонибудь)

*

Оффлайн dmitry_stas

Re: Плавный якорь из меню на Jquery
« Ответ #1 : 02.02.2016, 14:05:40 »
первая попавшаяся в Google ссылка - http://the-sever.ru/jquery-yakor-delaem-plavnuyu-prokrutku/
Тут дарят бакс просто за регистрацию! Успей получить!
Все советы на форуме раздаю бесплатно, то есть даром. Индивидуально бесплатно консультирую только по вопросам стоимости индивидуальных консультаций

*

Оффлайн Timerlan

Re: Плавный якорь из меню на Jquery
« Ответ #2 : 02.02.2016, 14:46:41 »
Этот метод не катит

*

Оффлайн darkghost

Re: Плавный якорь из меню на Jquery
« Ответ #3 : 02.02.2016, 19:21:49 »
Этот метод не катит
Почему? Ведь большинство примеров построены именно так. Не работает совсем или что?

*

Оффлайн dmitry_stas

Re: Плавный якорь из меню на Jquery
« Ответ #4 : 02.02.2016, 19:23:14 »
Почему?
потому что видимо скопировали 1:1 и ожидают чуда
Тут дарят бакс просто за регистрацию! Успей получить!
Все советы на форуме раздаю бесплатно, то есть даром. Индивидуально бесплатно консультирую только по вопросам стоимости индивидуальных консультаций

*

Оффлайн darkghost

Re: Плавный якорь из меню на Jquery
« Ответ #5 : 03.02.2016, 03:13:49 »
Так это понятно, но ведь этот jQuery скрипт может конфликтовать с другими скриптами, что скорее так и есть.
А дописать к скрипту НоКонфликт и переименовать переменную наверное не догадались, не пробовали

*

Оффлайн Timerlan

Re: Плавный якорь из меню на Jquery
« Ответ #6 : 03.02.2016, 12:07:04 »
 просто не понимаю код) по этому и прошу помощи!

*

Оффлайн vipiusss

  • ********
  • 5844
  • [+]324 / [-]10
  • Пол: Мужской
  • Skype: renor_
    • Просмотр профиля
Re: Плавный якорь из меню на Jquery
« Ответ #7 : 03.02.2016, 12:41:25 »
просто не понимаю код) по этому и прошу помощи!
Уважаемый, ну у вас ручки не оттуда или ленитесь научиться и/или понять.
Вы и тот код в вашей иной теме не можете поставить, хотя там и исходники есть и демо и разжёвано всё.
Тут форум не "сделайте мне сами", а форум поддержки движка и расширений.
Если не умеете-гоу в коммерческий раздел, но советую не брать на себя такую ношу и не писать, что код или решение не работает.
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями

*

Оффлайн Timerlan

Re: Плавный якорь из меню на Jquery
« Ответ #8 : 03.02.2016, 17:33:33 »
Если брать из примера по ссылке  http://the-sever.ru/jquery-yakor-delaem-plavnuyu-prokrutku/
Там такой код
<script type="text/javascript">
$(document).ready(function() {
   $('a[href^="#"]').click(function () {
     elementClick = $(this).attr("href");
     destination = $(elementClick).offset().top;
     if($.browser.safari){
       $('body').animate( { scrollTop: destination }, 1100 );
     }else{
       $('html').animate( { scrollTop: destination }, 1100 );
     }
     return false;
   });
 });
</script>

создал я js фаил, точнее я не знаю где его создавать я взял из шаблона какой был, открыл его через MS Frontpage отредактировал и сохраил в папку js под другим именем.  8)

ДАЛЕЕ  ;D

открыл фаил шаблона index.php
там я прикрутил скрипт <script type="text/javascript" src="./js/file.js"></script>
<?php
defined
('_JEXEC') or die;

/**
 * Template for Joomla! CMS, created with Artisteer.
 * See readme.txt for more details on how to use the template.
 */

// Check if the template is compatible with the currently used Joomla version:
$version = new JVersion();
if (
'1.5' != $version->RELEASE)
    exit(
'This template is not compatible with Joomla ' $version->RELEASE ' and should be replaced.');

require_once 
dirname(__FILE__). DIRECTORY_SEPARATOR 'functions.php';

// Create alias for $this object reference:
$document = & $this;

// Shortcut for the template base url:
$templateUrl $document->baseurl '/templates/' $document->template;

ArtxLoadClass("Artx_Page");

// Initialize $view:
$view $this->artx = new ArtxPage($this);

// Decorate component with Artisteer style:
$view->componentWrapper();

?>

<!DOCTYPE html>
<html dir="ltr" lang="<?php echo $document->language?>">
<head>
    <jdoc:include type="head" />
    <link rel="stylesheet" href="<?php echo $document->baseurl?>/templates/system/css/system.css" />
    <link rel="stylesheet" href="<?php echo $document->baseurl?>/templates/system/css/general.css" />

    <!-- Created by Artisteer v4.1.0.59861 -->
   
   
    <meta name="viewport" content="initial-scale = 1.0, maximum-scale = 1.0, user-scalable = no, width = device-width">

    <!--[if lt IE 9]><script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
    <link rel="stylesheet" href="<?php echo $templateUrl?>/css/template.css" media="screen">
    <!--[if lte IE 7]><link rel="stylesheet" href="<?php echo $templateUrl?>/css/template.ie7.css" media="screen" />
<![endif]-->
    <link rel="stylesheet" href="<?php echo $templateUrl?>/css/template.responsive.css" media="all">


    <script>if ('undefined' != typeof jQuery) document._artxJQueryBackup = jQuery;</script>
    <script src="<?php echo $templateUrl?>/jquery.js"></script>
    <script>jQuery.noConflict();</script>

    <script src="<?php echo $templateUrl?>/script.js"></script>
    <?php $view->includeInlineScripts()?>
    <script>if (document._artxJQueryBackup) jQuery = document._artxJQueryBackup;</script>
    <script src="<?php echo $templateUrl?>/script.responsive.js"></script>
    <script type="text/javascript" src="./js/light.js"></script>
</head>
<body>

<div id="art-main">
    <div class="art-sheet clearfix">
<header class="art-header"><?php echo $view->position('header''art-nostyle'); ?>


    <div class="art-shapes">

            </div>




               
                   
</header>
<?php if ($view->containsModules('user3''extra1''extra2')) : ?>
<nav class="art-nav">
   
<?php if ($view->containsModules('extra1')) : ?>
<div class="art-hmenu-extra1"><?php echo $view->position('extra1'); ?></div>
<?php endif; ?>
<?php if ($view->containsModules('extra2')) : ?>
<div class="art-hmenu-extra2"><?php echo $view->position('extra2'); ?></div>
<?php endif; ?>
<?php echo $view->position('user3'); ?>
 
    </nav>
<?php endif; ?>
<?php echo $view->position('banner1''art-nostyle'); ?>
<?php echo $view->positions(array('top1' => 33'top2' => 33'top3' => 34), 'art-block'); ?>
<div class="art-layout-wrapper">
                <div class="art-content-layout">
                    <div class="art-content-layout-row">
                        <?php if ($view->containsModules('left')) : ?>
<div class="art-layout-cell art-sidebar1">
<?php echo $view->position('left''art-block'); ?>




                        </div>
<?php endif; ?>
                        <div class="art-layout-cell art-content">
<?php
  
echo $view->position('banner2''art-nostyle');
  if (
$view->containsModules('breadcrumb'))
    echo 
artxPost($view->position('breadcrumb'));
  echo 
$view->positions(array('user1' => 50'user2' => 50), 'art-article');
  echo 
$view->position('banner3''art-nostyle');
  echo 
artxPost(array('content' => '<jdoc:include type="message" />''classes' => ' art-messages'));
  echo 
'<jdoc:include type="component" />';
  echo 
$view->position('banner4''art-nostyle');
  echo 
$view->positions(array('user4' => 50'user5' => 50), 'art-article');
  echo 
$view->position('banner5''art-nostyle');
?>




                        </div>
                        <?php if ($view->containsModules('right')) : ?>
<div class="art-layout-cell art-sidebar2">
<?php echo $view->position('right''art-block'); ?>


                        </div>
<?php endif; ?>
                    </div>
                </div>
            </div>
<?php echo $view->positions(array('bottom1' => 33'bottom2' => 33'bottom3' => 34), 'art-block'); ?>
<?php echo $view->position('banner6''art-nostyle'); ?>

<footer class="art-footer">
<?php if ($view->containsModules('copyright')) : ?>
    <?php echo $view->position('copyright''art-nostyle'); ?>
<?php else: ?>
<p><!-- Rating@Mail.ru counter -->
<script type="text/javascript">
var _tmr = _tmr || [];
_tmr.push({id: "2549732", type: "pageView", start: (new Date()).getTime()});
(function (d, w) {
   var ts = d.createElement("script"); ts.type = "text/javascript"; ts.async = true;
   ts.src = (d.location.protocol == "https:" ? "https:" : "http:") + "//top-fwz1.mail.ru/js/code.js";
   var f = function () {var s = d.getElementsByTagName("script")[0]; s.parentNode.insertBefore(ts, s);};
   if (w.opera == "[object Opera]") { d.addEventListener("DOMContentLoaded", f, false); } else { f(); }
})(document, window);
</script><noscript>&lt;div style="position:absolute;left:-10000px;"&gt;
&lt;img src="http://www.9fa9b920-6ff9-45a1-b8fa-7df7e2bbac0e-image.com/.webarchive//top-fwz1.mail.ru/counter?id=2549732;js=na" style="border:0;" height="1" width="1" alt="Рейтинг@Mail.ru"&gt;
&lt;/div&gt;</noscript>
<!-- //Rating@Mail.ru counter -->
<!-- Rating@Mail.ru logo -->
<a href="http://top.mail.ru/jump?from=2549732">
<img src="/top-fwz1.mail.ru/counter?id=2549732;t=479;l=1" height="31" width="88" alt="Рейтинг@Mail.ru"></a>
<!-- //Rating@Mail.ru logo -->
<!-- HotLog -->
<span id="hotlog_counter"></span>
<span id="hotlog_dyn"></span>
<script type="text/javascript">
var hot_s = document.createElement('script');
hot_s.type = 'text/javascript'; hot_s.async = true;
hot_s.src = 'http://js.hotlog.ru/dcounter/2404402.js';
hot_d = document.getElementById('hotlog_dyn');
hot_d.appendChild(hot_s);
</script>
<noscript>
&lt;a href="http://click.hotlog.ru/?2404402" target="_blank"&gt;&lt;img border="0"&gt;&lt;/a&gt;
</noscript>
<!-- /HotLog --></p>
<?php endif; ?>
</footer>

    </div>
</div>



<?php echo $view->position('debug'); ?>
</body>
</html>

потом ставлю вот такой вот якорь
<p><a id="rey"></a>
и такую ссылку

<a href="#rey">vftrty</a>
Якорь работает но не плавно :( :'(


P.S, на другом своем сайте(шаблон скаченный) я просто ставлю якорь и ссылка, там прокрутка сама по себе плавная красивая,
а на этом дурацком сайте + для которого я делал шаблон в вонючем Artisteer 4.  прокрутка так и осталась резкая !

Что не так я не пойму, мб скрипты конфликтуют но я не знаю как с этим бороться)

*

Оффлайн Timerlan

Re: Плавный якорь из меню на Jquery
« Ответ #9 : 03.02.2016, 17:36:35 »
Зато как сделать ссылку на якорь из меню я разобрался)

просто создаю внешнюю ссылку и в поле сылка пишу #имя_якоря

*

Оффлайн dmitry_stas

Re: Плавный якорь из меню на Jquery
« Ответ #10 : 03.02.2016, 18:04:03 »
Цитировать
мб скрипты конфликтуют
может быть, но мы ж вашу консоль не видим. посмотрите в фаирбаге есть ли конфликты. в файл надеюсь когда сохраняли, без <script type="text/javascript"> и </script> сохранили?
Тут дарят бакс просто за регистрацию! Успей получить!
Все советы на форуме раздаю бесплатно, то есть даром. Индивидуально бесплатно консультирую только по вопросам стоимости индивидуальных консультаций

*

Оффлайн Timerlan

Re: Плавный якорь из меню на Jquery
« Ответ #11 : 03.02.2016, 18:20:36 »
может быть, но мы ж вашу консоль не видим. посмотрите в фаирбаге есть ли конфликты. в файл надеюсь когда сохраняли, без <script type="text/javascript"> и </script> сохранили?
сохранял без</script>. , что такое фаирбаг?

*

Оффлайн fsv

Re: Плавный якорь из меню на Jquery
« Ответ #12 : 03.02.2016, 21:05:42 »
что такое фаирбаг?
А что такое MS Frontpage?
И что это за путь к файлу?
<script type="text/javascript" src="./js/file.js"></script>
Посмотрите, грузится ли ваш скрипт.
Заказать разработку:    расширения Joomla  |   интерфейсы на javascript(jQuery)  |  мобильные приложения

*

Оффлайн vipiusss

  • ********
  • 5844
  • [+]324 / [-]10
  • Пол: Мужской
  • Skype: renor_
    • Просмотр профиля
Re: Плавный якорь из меню на Jquery
« Ответ #13 : 03.02.2016, 22:29:50 »
А что такое MS Frontpage?
И что это за путь к файлу?
<script type="text/javascript" src="./js/file.js"></script>
Посмотрите, грузится ли ваш скрипт.
я уже сижу, молча читаю.
ну как можно так пути прописывать? ну я вверху писал?смотрите внимательно линки!
ну ппц какой-то.
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями

*

Оффлайн Timerlan

Re: Плавный якорь из меню на Jquery
« Ответ #14 : 03.02.2016, 22:40:15 »
я уже сижу, молча читаю.
ну как можно так пути прописывать? ну я вверху писал?смотрите внимательно линки!
ну ппц какой-то.

ну так объясните непонимающему человеку раз знаете в чем дело!

*

Оффлайн vipiusss

  • ********
  • 5844
  • [+]324 / [-]10
  • Пол: Мужской
  • Skype: renor_
    • Просмотр профиля
Re: Плавный якорь из меню на Jquery
« Ответ #15 : 03.02.2016, 22:47:32 »
ну так объясните непонимающему человеку раз знаете в чем дело!
я вам ничем не обязан, как и форум.
тут собрались люди по интересам и понимающие, что они хотят.
я вам дал и тут(для этого решения) и там, чёткую разжёванную ссылку с демо и с иходниками.
вы ждёте, чтоб за вас сделали?
тогда гоу на киви, в личку доступ и 10 минут и будет работать.
я не буду вам объяснять .....цать раз, что за ошибка и сидеть искать.
простите за прямоту и за факты.
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями

*

Оффлайн Timerlan

Re: Плавный якорь из меню на Jquery
« Ответ #16 : 03.02.2016, 23:57:23 »
я вам ничем не обязан, как и форум.
тут собрались люди по интересам и понимающие, что они хотят.
я вам дал и тут(для этого решения) и там, чёткую разжёванную ссылку с демо и с иходниками.
вы ждёте, чтоб за вас сделали?
тогда гоу на киви, в личку доступ и 10 минут и будет работать.
я не буду вам объяснять .....цать раз, что за ошибка и сидеть искать.
простите за прямоту и за факты.
Я и не говорю что вы обязаны) нет так нет. Может быть кто другой подскажет.

*

Оффлайн vipiusss

  • ********
  • 5844
  • [+]324 / [-]10
  • Пол: Мужской
  • Skype: renor_
    • Просмотр профиля
Re: Плавный якорь из меню на Jquery
« Ответ #17 : 04.02.2016, 00:03:21 »
не обижайтесь, но как вам помогать, если вы не можете сделать пошагово?
вот в примерах и там и там вам расписано, ну(простите) тупой думаю справится.
ничего личного, пусть другие подсказывают, никто не против.
Миграция, установка, обновление версий Joomla  |  Создание сайтов "под ключ"  |  Эксклюзивные заглушки "offline"  |  Работа с "напильником" над шаблонами и расширениями

*

Оффлайн icom

Re: Плавный якорь из меню на Jquery
« Ответ #18 : 04.02.2016, 05:03:09 »
$(document).ready(function() {
поменяйте на
jQuery(document).ready(function($) {

Цитировать
у как можно так пути прописывать? ну я вверху писал?смотрите внимательно линки!
и так тоже можно)