Ticker problems, wont load in motion, just displays all text. jquery ajax

StackOverflow https://stackoverflow.com/questions/21779829

Question

i am after making an news ticker and its the first time ive come across this website.

http://www.jquerynewsticker.com/

and ive got the code all set up as this 

 <div class="news_ticker"><link href="LPMS\production_scn\jquery_news_ticker\styles\ticker-style.css" rel="stylesheet" type="text/css" />
                    <script src="LPMS\production_scn\jquery_news_ticker\includes\jquery.ticker.js" type="text/javascript"></script>
              <ul id="js-news" class="js-hidden">
                <li class="news-item"><a href="#">This is the 1st latest news item.</a></li>
                <li class="news-item"><a href="#">This is the 2nd latest news item.</a></li>
                <li class="news-item"><a href="#">This is the 3rd latest news item.</a></li>
                <li class="news-item"><a href="#">This is the 4th latest news item.</a></li>
                </ul>


            <script type="text/javascript">
            $(function () {
            $('#js-news').ticker();
            });
            </script>


               </div>

im assuming it all goes in the 1 div? it simple lists latest items news instead of scrolling or anything, its almost as if its not picking up the jquery but i have rooted it to find the source, can anyone shed any light on this for me?

EDIT/UPDATE

with thanks to Java_User i have managed to get it to somewhat work, now my issues is it wont display what i ask it to output, it only shows a line even when i change the text /input.

my code now is.. this is in the head

<link href="/LPMS/production_scn/jquery_news_ticker/styles/ticker-style.css" rel="stylesheet" type="text/css" />
<script src="/LPMS/production_scn/jquery_news_ticker/includes/jquery.ticker.js" type="text/javascript"></script>
</head>

this is at the bottom of the page ( the rest of the page is empty to avoid any conflictions for now!)

<div class="clear_line"></div>
 <script type="text/javascript">
    $(function () {
        $('#js-news').ticker();
    });
</script>

<!-- News Feed ticker  - use jquery to scroll ticker!! -->
<div class="news_feed">
    <img src="/LPMS/images/news/breaking_news.png" style="border-style:none;">
   <div class="news_ticker"><ul id="js-news" class="js-hidden">
    <li class="news-item"><a href="#">This is the 1st latest news item.</a></li>
    <li class="news-item"><a href="#">This is the 2nd latest news item.</a></li>
    <li class="news-item"><a href="#">This is the 3rd latest news item.</a></li>
    <li class="news-item"><a href="#">This is the 4th latest news item.</a></li>
    </ul> </div></div>


</div>

any ideas why it displays just an underscore _ like that? its doing my head in!

thanks

Was it helpful?

Solution 2

i found that putting the ticker script into a seperate .js file works flawlessly.

taking this out:

  <script type="text/javascript">
            $(function () {
            $('#js-news').ticker();
            });
            </script>

and putting it into its own .js file and calling it has allowed it to work for me.

OTHER TIPS

Please include your below scripts/css inside your <head> tag and it should work.

<link href="LPMS\production_scn\jquery_news_ticker\styles\ticker-style.css" rel="stylesheet" type="text/css" />
<script src="LPMS\production_scn\jquery_news_ticker\includes\jquery.ticker.js" type="text/javascript"></script>

You may need to move the below js code out of your <div> as well. Check if this solves rest issue.

<script type="text/javascript">
            $(function () {
            $('#js-news').ticker();
            });
            </script>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top