Archived

This topic is now archived and is closed to further replies.

  • 0

Resolved Special Page Scrolling Effect With Jquery!


Question

Posted · Report post

Hello,

Recently I've found a tutorial that shows how to design a website with a really simple page scrolling effect using jquery.

I wonder if this can be used in pagelines to add some simple content inside a page. It would be really cool!

Please if you have some little time, visit the site of the tutorial, it is very short.

http://blog.entheosw...with-css-jquery

Thanks a lot!

Share this post


Link to post
Share on other sites

8 answers to this question

Posted · Report post

I think it is closed.

Thanks!

Share this post


Link to post
Share on other sites

Posted · Report post

I'm not a developer, but looking at the code I can't see any reason why you wouldn't be able to achieve this. You'd probably need to find a way of working it into a hook (http://api.pagelines.com/hooks) or creating a child theme out of it (http://demo.pagelines.me/theming), as you wouldn't be able to edit/alter the core PL files. They've provided you with all the data, so it would just be putting it all together.

Share this post


Link to post
Share on other sites

Posted · Report post

One last question related to this, i don't know how to use the hooks, where should i put the jquery code?

this is the code:

$(".link").click(function(){

var page = $(this).attr("id");

var color = $(this).attr("class");

color = color.substr(5,6);

$('#all_pages').animate({left: (page-1)*(-1000) });

$("body").animate({backgroundColor: '#'+color});

$("#menu ul li").removeClass('active');

$(this).addClass('active');

});

Share this post


Link to post
Share on other sites

Posted · Report post

thanks man, I'll see what i can do with all this.

Share this post


Link to post
Share on other sites

Posted · Report post

I don't know jquery code, but I think it should be wrapped in something like this example:


   <script src="prototype.js"></script>

   <script src="jquery.js"></script>

   <script>

	 jQuery.noConflict();


	 // Use jQuery via jQuery(...)

	 jQuery(document).ready(function(){

	   jQuery("div").hide();

	 });


	 // Use Prototype with $(...), etc.

	 $('someid').hide();

   </script>

If your code has the <script> wrap, then you can go to Dashboard > PageLines > Site Options > Custom Code and paste the full code into the Header Scripts section. Broken code however, will likely cause problems for your site, so make sure it's the correct, valid code.

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks, i have just realized that error!

the topic should be closed now.

thaks again to all of the team.

Share this post


Link to post
Share on other sites

Posted · Report post

The topic was marked as resolved.

Share this post


Link to post
Share on other sites

Posted · Report post

Sounds good! Please let us know if you consider this topic resolved.

Share this post


Link to post
Share on other sites