How to set scrollTo with class setting?

Forum Moderators: open

Message Too Old, No Replies

How to set scrollTo with class setting?

toplisek

5:37 pm on Mar 23, 2013 (gmt 0)

File: jquery.scrollTo-min.js

<html>
<head>
<script language="JavaScript">
jQuery(document).ready(function() {
$(".myclass").scrollTo($('.myclass'), 800 );
});
</script>
</head>

<head>

</head>
<body>
<a href=".myclass">Jump to class</a>

vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs vdbgdbhfdhdrhrrehs
vdbgdbhfdhdrhrrehs
<div class="myclass">vdbgdbhfdhdrhrrehs</div>
</body>

</html>

toplisek

8:22 pm on Mar 23, 2013 (gmt 0)

Issue is that I have to use due to application CLASS specifications and not id=....
<li>
<a href="#paragraph1">Paragraph 1</a>
</li>
is ID specification and it works perfect with ID like


In ut sapien sem, a convallis odio. Aenean consequat ornare egestas. Aenean adipiscing magna et ante varius viverra. Nullam hendrerit, augue et porta bibendum, est ante pretium nunc, quis euismod enim dui sed neque. Duis dictum odio quis lacus tempor a hendrerit elit laoreet. Nunc id nisl vel risus rutrum mattis. Sed fringilla ultrices eleifend. Curabitur mi sem, hendrerit et semper gravida, gravida eget ipsum. Ut sit amet magna elit, non viverra ante. Nulla ut lorem risus. Morbi ac iaculis sem. Maecenas accumsan arcu eu nulla aliquet non pharetra risus adipiscing. Suspendisse consequat justo a sapien dictum dapibus. Duis fermentum risus a neque bibendum quis malesuada erat tempus. Nunc sodales hendrerit porta.


Is it technically possible to set CLASS like:

daveVk

12:37 pm on Mar 25, 2013 (gmt 0)

- OK

<a href=".myclass">Jump to class</a> - BAD, not a valid href

need to excecute .scrollTo like at top page

<a href="#" onclick="$('.myclass').scrollTo($('.myclass'), 800 );return false">Jump to class</a>

toplisek

4:14 pm on Mar 25, 2013 (gmt 0)

I have another issue:
1. I have received an error from debugger like: Object doesn't support this property or method
Which object defines working scroll as removed nav will not work scroll but even I put nav it will report
Object doesn't support this property or method

2. Where to put jQuery ad not $ in the correct way?
Lines:
[PHP]

$('nav ul li a').click(function(){
var el = $(this).attr('href');
var elWrapped = $(el);

scrollToDiv(elWrapped,40);

return false;
});

[/PHP]
Javascript is the following:
[PHP]

<script language = "javascript" type = "text/javascript" charset="utf-8">
jQuery(document).ready(function() {
function scrollToDiv(element,navheight){
var offset = element.offset();
var offsetTop = offset.top;
var totalScroll = offsetTop-navheight;

$('body,html').animate({
scrollTop: totalScroll
}, 500);
}
jQuery('nav ul li a').click(function(){
var el = $(this).attr('href');
var elWrapped = $(el);

scrollToDiv(elWrapped,40);

return false;
});
} );
</script>

[/PHP]

daveVk

11:57 pm on Mar 25, 2013 (gmt 0)

I have received an error from debugger like: Object doesn't support this property or method

Note the line number in error message, and find it in 'view source'. The Object in error will be revealed.

It is better to look at (and quote) 'view source' than PHP in most cases.

toplisek

10:29 am on Mar 26, 2013 (gmt 0)

What doe sit mean object in error:
what I should change?

$('nav ul li a').click(function(){
var el = $(this).attr('href');
var elWrapped = $(el);

scrollToDiv(elWrapped,40);

return false;
});

daveVk

10:39 pm on Mar 26, 2013 (gmt 0)

You get the message "Object doesn't support this property or method" when you have something like

dog.name

and dog does have a name (possibly because dog is null or undefined)

The two places where it could occurs in you code are shown in red.

$('nav ul li a').click(function(){
var el = $(this).attr('href');
var elWrapped = $(el);

scrollToDiv(elWrapped,40);

return false;
});

if error occurs before click then 1st else 2nd

$().click and $().attr should not error in that way, make
sure error message refers to that code.