Help me integrate in my website this kind of marquee, or scroll text:
Don’t know how to start, because i don’t understand how they done it. I have tried to understand the code but i couldn’t.
You have quite a few tutorials on how to do that, especially with jQuery.
jQuery Plug-in http://www.codeunit.co.za/2010/01/18/a-jquery-horizontal-scrolling-news-ticker/
JQuery function http://stackoverflow.com/questions/211111/jquery-scrollto-jquery-serialscroll-horizontal-scrolling
Thanks for the quick answer, but i have some problems finding out how to run the jquery code, do i need a soft or something? Sorry i am a noob in jquery, i know some php, and html advanced, but jquery: none;
jQuery is just a library. You need to download it and then link it to the page so you can build your custom functions, or link to a copy of jQuery directly from Google’s servers.
<!doctype html>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
</html>
Once you have jQuery loaded, you can use it to create new functions based on those that are already built in it.
I have done the following, i have copied and paste the codes from the first tutorial. Done as you said, added the jquery.js, but it doesn’t work.
Have a look at code, please correct me if i am wrong:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml” <?php language_attributes(); ?>>
<head profile=“http://gmpg.org/xfn/11”>
<meta http-equiv=“Content-Type” content=“<?php bloginfo(‘html_type’); ?>; charset=<?php bloginfo(‘charset’); ?>” />
<title><?php bloginfo(‘name’); ?> <?php if ( is_single() ) { ?> » Blog Archive <?php } ?> <?php wp_title(); ?></title>
<meta name=“generator” content=“WordPress <?php bloginfo(‘version’); ?>” /> <!-- leave this for stats –>
<meta name=“description” content=“<?php bloginfo(‘description’) ?>” />
<meta name=“keywords” content=“” />
<link rel=“stylesheet” href=“<?php bloginfo(‘stylesheet_url’); ?>” type=“text/css” media=“all” />
<link rel=“alternate” type=“application/rss+xml” title=“<?php bloginfo(‘name’); ?> RSS Feed” href=“<?php bloginfo(‘rss2_url’); ?>” />
<link rel=“pingback” href=“<?php bloginfo(‘pingback_url’); ?>” />
<link rel=“Shortcut Icon” href=“http://www.real-estate-tipz.com/wp-content/themes/zherald/images/favicon.png” type=“image/x-icon” />
<script type=“text/javascript” src=“<?php bloginfo(‘template_directory’); ?>/js/jquery-1.2.6.min.js”></script>
<script type=“text/javascript” src=“<?php bloginfo(‘template_directory’); ?>/js/jquery-ui-personalized-1.5.2.packed.js”></script>
<script type=“text/javascript” src=“<?php bloginfo(‘template_directory’); ?>/js/sprinkle.js”></script>
<script type=“text/javascript” src=“<?php bloginfo(‘template_directory’); ?>/js/glide.js”></script>
<link rel=“stylesheet” type=“text/css” href=“<?php bloginfo(‘template_directory’); ?>/minipost.css” media=“screen” />
<link rel=“stylesheet” type=“text/css” href=“<?php bloginfo(‘template_directory’); ?>/glide.css” media=“screen” />
<script src=“http://www.real-estate-tipz.com/scrollup.js” type=“text/javascript”></script>
<script src=“http://www.real-estate-tipz.com/jquery.js” type=“text/javascript”></script>
<script type=“text/javascript”><!–//–><![CDATA-[//><!–
sfHover = function() {
if (!document.getElementsByTagName) return false;
var sfEls = document.getElementById(“menu”).getElementsByTagName(“li”);
var sfEls1 = document.getElementById(“catmenu”).getElementsByTagName(“li”);
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), “”);
}
}
for (var i=0; i<sfEls1.length; i++) {
sfEls1[i].onmouseover=function() {
this.className+=" sfhover1";
}
sfEls1[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover1\\b"), “”);
}
}
}
if (window.attachEvent) window.attachEvent(“onload”, sfHover);
//–><!]]></script>
<!–[if lte IE 6]>
<script type=“text/javascript”>
/* <![CDATA[ /
blankimgpath = ‘<?php bloginfo(‘template_url’); ?>/images/blank.gif’;
/ ]]> */
</script>
<style type=“text/css” media=“screen”>
img { behavior: url(“<?php bloginfo(‘template_url’); ?>/js/ie6pngfix.htc”); }
</style>
<![endif]–>
<?php wp_get_archives(‘type=monthly&format=link’); ?>
<?php //comments_popup_script(); // off by default ?>
<?php wp_head(); ?>
</head>
<body>
<script language=JavaScript>
<!–
//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com
var message="Copyright ©2011 - Real Estate Tips ";
///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}
document.oncontextmenu=new Function(“alert(message);return false”)
// –>
</script>
<div id=“wrapper”>
<div id=“topbar”>
<span class=“day”><?php echo date('j ‘); ?></span>
<div class=“year”>
<span class=“mony”><?php echo date(’ F - Y ‘); ?></span><br/>
<span class=“dname”><?php echo date(’ l '); ?></span>
<span class=“socialnet”><iframe src=“http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.real-estate-tipz.com&layout=button_count&show_faces=true&width=60&action=like&colorscheme=light&height=21” scrolling=“no” frameborder=“0” style=“border:none; overflow:hidden; width:65px; height:21px;” allowTransparency=“true”></iframe>
<a href=“http://twitter.com/share” class=“twitter-share-button” data-url=“http://www.real-estate-tipz.com” data-count=“horizontal”>Tweet</a><script type=“text/javascript” src=“http://platform.twitter.com/widgets.js”></script>
</span>
</div>
<span class=“rsnews”>
<a href=“<?php bloginfo(‘rss2_url’); ?>”> SUBSCRIBE TO NEWS </a><br/>
<a href=“<?php bloginfo(‘comments_rss2_url’); ?>”>SUBSCRIBE TO COMMENTS</a>
</span>
</div>
<div id=“top”>
<div class=“blogname”>
<h1><a href=“<?php bloginfo(‘siteurl’);?>/” title=“<?php bloginfo(‘name’);?>”><?php bloginfo(‘name’);?></a></h1>
</div>
<?php include (TEMPLATEPATH . ‘/headbanner.php’); ?>
</div>
<div id=“foxmenucontainer”>
<div id=“menu”>
<ul>
<li><a href=“<?php echo get_settings(‘home’); ?>”>Home</a></li>
<li class=“page_item page-item-8”><a href=“http://www.real-estate-tipz.com/link-market/” title=“Resources”>Resources</a></li>
<li><a href=“http://forum.real-estate-tipz.com”>Forum</a></li>
</div>
</div>
<div class=“clear”></div>
<div id=“catmenucontainer”>
<div id=“catmenu”>
<ul>
<?php wp_list_categories(‘sort_column=name&title_li=&depth=4’); ?>
</ul>
</div>
</div>
<div id="scrollup">
<div class="headline">
Latest News
</div>
</div>
<div class=“clear”></div>
<div id=“casing”>
I haven’t read the code because I couldn’t help to observe that you use WordPress. WP is a bit special with jQuery. It comes packed with it, as you can see in your code
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery-ui-personalized-1.5.2.packed.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/sprinkle.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/glide.js"></script>
The very first line tells you that you’re using jQuery version 1.2.6. This is an old version.
Do you use FireFox and FireBug? It will save you tons of time to test your jQuery instead of having to write the function on the page and then re-load it to see if works 
I would use a higher version. 1.2 is old. You only need to copy the appropiate file in the appropiate folder and change the appropiate <script> line so it calls to the right file.
So can you please paste the code of the version that you use.
Hey i managed to make it run, but now i don’t understand why is it show vertical, have a look
Where do you keep the code? scrollup.js?
in http://www.real-estate-tipz.com/scrollup.js, where the index is, and the style css: http://www.real-estate-tipz.com/wp-content/themes/zherald/style.css
this is the code for scrollup.js
<script type=“text/javascript”>
var headline_count;
var headline_interval;
var old_headline = 0;
var current_headline = 0;
$(document).ready(function(){
headline_count = $(“div.headline”).size();
$(“div.headline:eq(”+current_headline+“)”).css(‘top’,‘5px’);
headline_interval = setInterval(headline_rotate,10000); //time in milliseconds
$(‘#scrollup’).hover(function() {
clearInterval(headline_interval);
}, function() {
headline_interval = setInterval(headline_rotate,10000); //time in milliseconds
headline_rotate();
});
});
function headline_rotate() {
current_headline = (old_headline + 1) % headline_count;
$(“div.headline:eq(” + old_headline + “)”).animate({top: -205},“slow”, function() {
$(this).css(‘top’,‘110px’);
});
$(“div.headline:eq(” + current_headline + “)”).show().animate({top: 5},“slow”);
old_headline = current_headline;
}
</script>
and for the css
#scrollup {
position: relative;
overflow: hidden;
border: 1px solid #000;
height: 30px;
width: 100%;
}
.headline {
position: absolute;
top: 210px;
left: 5px;
height: 30px;
width:100%;
}
.headline a {
font-size:25px;
}
Hey, i managed to make it horizontal, but now I have encountered another problem: i have input 3 headlines, and when the pages load, all of the free headline are showed in the same place, and until they start scrolling you can’t understand anything. Have a look. And Thank you for helping me.
You’re doing a great job and should be proud of yourself. I’ll take a look at it and let you know if I can find the problem.
I’m not sure, but it looks like your script and your css place your headlines in the same position. Can’t confirm it though because I don’t have the HTML related to the headlines. You didn’t post it before… would it be possible for you to post the HTML?