0

JQUERY UI TAB AND PAGINATION HTML

Posted December 31st, 2009 in Development by Gevork
<script type="text/javascript">
$(function() {
$("#tabs").tabs();

$('#demo').tabs({
load: function(event, ui) {
$('a', ui.panel).click(function() {
$(ui.panel).load(this.href);
return false;
});
}
});
});

</script>

<div>

<div id="tabs">

<ul>
<li><a href="#tabs-1">My Wall </a></li>
<li><a href="#tabs-2">Friends</a></li>
<li><a href="/no_header/handshakes/">FriendsOfFriends</a></li>
<li><a href="/no_header/comments/">Comments</a></li>

</ul>

<div id="tabs-1">

<button onClick="showSlidingDiv(); return false;">Write Here</button><br />

<div id="quickReply" style="display:none">

<div style="padding: 5px 12px">

<form id="submit" method="post">

<input type="hidden" id="to" value="43">
<input type="hidden" id="from" value="43">
<textarea  id="comment"  name="comment" raws="20" cols="80" ></textarea>  <br>
<button> Write </button>
</form>
</div>
</div>

<div id='msg' style='display:none'><b>MessageSent.</b></div>
<div id='msg_graffiti' class='msg' style='display:none'>Graphic Sent.</div>
<div id='msg_audio' class='msg' style='display: none'>Audio Added.</div>
<div id="dld" style="display:none">Message Deleted.</div>

<div id="back" >

<div id="c24">
<div id="c24">
<table border="0" cellspacing="0" width="100%">
<tr>
<td>
<a href="/users/43">
<img src="/images/uploads/sm_d5821e71b7c39a3dc93fb07acfc05fb0.JPG" width="60"
</a>

</td>
<td>

<div>
<a href="/users/show/43">sdasdad</a> has wrote<br />
<small>2009-12-30 00:01:29</small>
</div>

<div id="wPost69912511" style="width: 315px; overflow: hidden;">каскдсадас</div>
<div><a href="/test/">Test</a>

<small>Write on my wall</small><span>|</span><a href="javascript: deletePost(69912511,8900318)"><small>Delete</small></a>
</div>
</td>
</tr>
</table>

</div>
</div>

<div id="c22">
<div id="c22">
<table border="0" cellspacing="0" width="100%">
<tr>
<td>
<a href="/users/43">
<img src="/images/uploads/sm_d5821e71b7c39a3dc93fb07acfc05fb0.JPG" width="60"
</a>

</td>
<td>

<div>
<a href="/users/show/43">sdasdad</a> has wrote<br />
<small>2009-12-29 23:59:18</small>
</div>

<div id="wPost69912511" style="width: 315px; overflow: hidden;">А я иду за питачком куку муку жуку</div>
<div><a href="/test/">Test</a>

<small>Write on my wall</small><span>|</span><a href="javascript: deletePost(69912511,8900318)"><small>Удалить</small></a>
</div>
</td>
</tr>
</table>

</div>
</div>

<div id="c21">
<div id="c21">
<table border="0" cellspacing="0" width="100%">
<tr>
<td>
<a href="/users/43">
<img src="/images/uploads/sm_d5821e71b7c39a3dc93fb07acfc05fb0.JPG" width="60"
</a>

</td>
<td>

<div>
<a href="/users/show/43">sdasdad</a> has wrote<br />
<small>2009-12-29 23:58:11</small>
</div>

<div id="wPost69912511" style="width: 315px; overflow: hidden;">А я иду за питачком куку муку жуку</div>
<div><a href="/test/">Test</a>

<small>Write on my wall</small><span>|</span><a href="javascript: deletePost(69912511,8900318)"><small>Удалить</small></a>
</div>
</td>
</tr>
</table>

</div>
</div>

<div id="c19">
<div id="c19">
<table border="0" cellspacing="0" width="100%">
<tr>
<td>
<a href="/users/43">
<img src="/images/uploads/sm_d5821e71b7c39a3dc93fb07acfc05fb0.JPG" width="60"
</a>

</td>
<td>

<div>
<a href="/users/show/43">sdasdad</a> has wrote<br />
<small>2009-12-29 23:30:11</small>
</div>

<div id="wPost69912511" style="width: 315px; overflow: hidden;">А я иду за питачком куку муку жуку</div>
<div><a href="/test/">Test</a>

<small>Write on my wall</small><span>|</span><a href="javascript: deletePost(69912511,8900318)"><small>Delete</small></a>
</div>
</td>
</tr>
</table>

</div>
</div>
</div>

HERE I WANT PAGINATION LIKE THIS ONE

<a href="/no_header/load_comments/1/1.html" id="pagination">1</a> | <a href="/no_header/load_comments/1/2.html" id="pagination">2</a> >>

</div>

<div id="tabs-2">

<div id="ctl00_cphMain_pnlFriends"><h3>My Friends</h3>
<table style="width: 700px;" border="0" cellpadding="0" cellspacing="2"><tbody>
<tr>
You have no friends Yet
</tr></tbody>
</table>

<br>
<a href="/account/friends/">All Friends(0)</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="/account/invite_multiple/">Invite Friends</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="/search/">Find Friends</a></div>
<br>

</div>

Leave a Reply