topical media & game development
lib-jquery-plugin-easy-news-news-example.htm / htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Jquery</title>
<script type="text/javascript" src="lib-jquery-plugin-easy-news-jquery-1.2.3.pack.js"></script>
<script type="text/javascript" src="lib-jquery-plugin-easy-news-jquery.easynews.js"></script>
<style>
html
{ background-color: #FFA928;
font: normal 76% "Arial", "Lucida Grande",Verdana, Sans-Serif;
color:black;
}
a { text-decoration: none; font-weight: bold; }
.news_style{
display:none;
}
.news_show
{
background-color: white;
color:black;
width:350px;
height:150px;
font: normal 100% "Arial", "Lucida Grande",Verdana, Sans-Serif;
overflow: auto;
}
.news_border
{
background-color: white;
width:350px;
height:150px;
font: normal 100% "Arial", "Lucida Grande",Verdana, Sans-Serif;
border: 1px solid gray;
padding: 5px 5px 5px 5px;
overflow: auto;
}
.news_mark{
background-color:white ;
font: normal 70% "Arial", "Lucida Grande",Verdana, Sans-Serif;
border: 0px solid gray;
width:361px;
height:35px;
color:black;
text-align:center;
}
.news_title{
font: bold 120% "Arial", "Lucida Grande",Verdana, Sans-Serif;
border: 0px solid gray;
padding: 5px 0px 9px 5px;
color:black;
}
.news_show img{
margin-left: 5px;
margin-right: 5px;
}
.buttondiv
{
position: absolute;
/*float: left;*/
/*top: 169px;*/
padding: 5px 5px 5px 5px;
background-color:white ;
border: 1px solid gray;
/*border-top-color: white;*/
border-top:none;
height:20px;
}
</style>
<script>
document.ready(function(){
var newsoption1 = {
firstname: "mynews",
secondname: "showhere",
thirdname:"news_display",
fourthname:"news_button",
newsspeed:'6000'
}
.init_news(newsoption1);<br>
</font></b><font color="#FFFF99"><b><br>
});<br>
</sript></b></font></p>
<ul>
<li><b><font color="#99FF66">firstname</font></b>
has to be the id of the div containing the news</li>
<li><b><font color="#99FF66">secondname</font><font color="#66CCFF"> </font></b>
is the id of container where you like news to
display</li>
<li><b><font color="#99FF66">thirdname</font></b><font color="#99FF66"><b>:</b></font> <b><font color="#66CCFF"> </font></b>is the id of container where you like
news title to
display</li>
<li><b><font color="#99FF66">fourthname</font></b><font color="#99FF66"><b> :</b></font> <b><font color="#66CCFF"> </font></b>is
the id of container where images file
inside(prev.pause.next) </li>
<li><font color="#00FF00"><b>playingtitle:</b></font>
set any thing you like (default is
<font color="#FFFF00"><b>Now Playing:</b></font>)</li>
<li><font color="#00FF00"><b>nexttitle:</b></font>set
any thing you like (default is <font color="#FFFF00">
<b>Next News:</b></font>)</li>
<li><font color="#00FF00"><b>prevtitle:</b></font>set
any thing you like (default is <font color="#FFFF00">
<b>Prev News:</b></font>)</li>
<li><b><font color="#99FF66">newsspeed</font></b><font color="#99FF66"><b> :</b></font> auto play pause time (1000=1sec default is
6sec)</li>
<li><b><font color="#99FF66">effectis</font></b><font color="#99FF66"><b> :</b></font>
<font color="#FFFF99"><b>0 :</b></font>fadeIn and
Out <font color="#FFFF99"><b>1:</b></font>slideUp
and Down <font color="#FFFF99"><b>2:</b></font>Left
to Right(default is 0)</li>
</ul>
<p>Q.is there any css need? </p>
<p>A.what your news slide look like, it depend on your
css ,if you are lazy to change it.you can copy css from
demo page.</p>
<p>Q.can add hyperlink to my news?</p>
<p>A.any thing you can play with HTML also can
play with here.</p>
<p>Q.can I change the images look(prev.pause.next)?</p>
<p>A.Yes ! but please keep their name as (prev.gif
prev0.gif pause.gif pause0.gif next.gif next0.gif)and
keep their id as (news_prev , news_pause, news_next)</p>
<p>
<img border="0" src="lib-jquery-plugin-easy-news-prev.gif" width="20" height="19"><img border="0" src="lib-jquery-plugin-easy-news-prev0.gif" width="20" height="19"><img border="0" src="lib-jquery-plugin-easy-news-pause.gif" width="20" height="19"><img border="0" src="lib-jquery-plugin-easy-news-pause0.gif" width="20" height="19"><img border="0" src="lib-jquery-plugin-easy-news-next.gif" width="20" height="19"><img border="0" src="lib-jquery-plugin-easy-news-next0.gif" width="20" height="19"></p>
<p>Q.how can I setup my news title?</p>
<p>A.for example:if you put your news as
following.please set rel=xxxxxx as your news title.</p>
<p><b><div id=mynews_hide_here ><br>
<div<font color="#FFFF99"> </font><font color="#00FF00">
rel</font>=<font color="#00FF00">mynews_title1 class<font color="#00FF00">news_style</font>>................</div><br>
<div <font color="#00FF00">rel</font>=<font color="#00FF00">mynews_title2
class<font color="#00FF00">news_style</font>>...............</div><br>
</div></b></p>
<p>***** IMPORTANT CLASS NAME REQUIRED********</p>
<p>How <font color="#99FF66"><b>Easy News</b></font>
know how many news needed to display and what is prev or
next news? <font color="#99FF66"><b>Easy News</b></font>
search any continer has class named
<font color="#00FF00"><b>news_style</b> </font>then
display it .see prev example .</p>
<p>Back to <a href=http://jquery.000webhost.info>Mian Page</a> click download to download it.</p>
<p> </p>
<p> </div>
</div>
<!--This is the left side 1st news hide container-->
<div id=mynews>
<div id=news1 class=news_style rel="Lou's newest book" >
<table><tr><td><img src=lib-jquery-plugin-easy-news-news1.jpg align=left width=38 height=60>
Lou's newest book -- Independents Day: Awakening the American Spirit -- hit shelves on November 6!<font color="#99FF66"><b>INDEPENDENTS DAY! </b></font></td></tr><tr><td>
<img src=lib-jquery-plugin-easy-news-news1-1.jpg align=left width=80 height=60><font color="#FF9900"><b>The weak dollar</b></font> is threatening the survival of European planemaker Airbus, chief executive Tom Enders told workers in Hamburg on Thursday.</td></tr></table>
</div>
<div id=news2 class=news_style rel="Lou Dobbs Tonight">
<table><tr><td><img src=lib-jquery-plugin-easy-news-news2.jpg align=left width=65 height=49><font color="#99CCFF"><b>"Lou Dobbs Tonight"</b></font> is moving to prime-time! Starting Monday, November 5th.</td></tr><tr><td>
<img src=lib-jquery-plugin-easy-news-news2-1.jpg align=left width=80 height=60><font color="#FF9900"><b>India</b></font> were held up by a rearguard action from Pakistan's Misbah-ul-Haq after taking control on the opening afternoon of the first Test in Delhi.</td></tr></table>
</div>
<div id=news3 class=news_style rel="On this Veterans Day"><table><tr><td>
<img src=lib-jquery-plugin-easy-news-news3.jpg align=left width=125 height=70><i><b><font color="#FFFF99">On this Veterans Day,</font></b></i> we honor the men and women serving our country in uniform. please watch here.</td></tr><tr><td>
<img src=lib-jquery-plugin-easy-news-news3-1.jpg align=left width=80 height=60>An annual report on<font color="#FF9900"><b> drug use</b></font> says around 4.5 million Europeans are likely to have used cocaine in the past year - a million more than in 2006.</td></tr></table>
</div>
<div id=news4 class=news_style rel="War on the Middle Class"><table><tr><td>
<img src=lib-jquery-plugin-easy-news-news4.gif align=left width=37 height=60><font color="#FF9900"><b>"War on the Middle Class"</b></font>
"The government, big business, and special interest groups are enriching themselves at our expense.</td></tr><tr><td>
<img src=lib-jquery-plugin-easy-news-news4-1.jpg align=left width=80 height=60><font color="#FF9900"><b>"In diplomacy, as you know, we don't get instant replies,"</b></font> said John Negroponte carefully, as he addressed the media before leaving Islamabad.</td></tr></table>
</div>
</div>
</body>
</html>
(C) Æliens
20/2/2008
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.