Skip to main content

Bug Tracker

Side navigation

Ticket #5949: PrimePropertiesWidget.html
File PrimePropertiesWidget.html, 4.7 KB (added by ericbojo, January 26, 2010 11:22PM UTC)

Basic test case (ignore css)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Prime Properties Widget</title>
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.8.0r4/build/reset/reset-min.css" />
<link rel="stylesheet" type="text/css" href="styles/styles.css" media="screen" />
<link rel="stylesheet" type="text/css" href="styles/scrollable-horizontal.css" />
<link rel="stylesheet" type="text/css" href="styles/scrollable-buttons.css" />
<link rel="stylesheet" type="text/css" href="styles/scrollable-navigator.css" />

<script type="text/javascript" src="jquery-1.4.1.js"></script>
<script type="text/javascript" src="jquery.tools.min.js" ></script>

<script type="text/javascript">
    $(document).ready(function() {
        // initialize scrollable
        $(".scrollable").scrollable({ "size": 1, "clickable": false, "easing": "swing", "speed": 400 }).circular().navigator();
    });
</script>

</head>
<body>

<div class="bI-blue-theme">

    <h1>Above</h1>
    <center>
    <div class="BestBetsPrimePropertyWidget">

        <!-- "previous page" action -->
        <div class="widgetBody">
        <!-- root element for scrollable -->
        <div class="scrollable">	
        	
	        <!-- root element for the items -->
	        <div class="items">      	
		        <!-- 1-5 -->
		        <div class="item">
		            <div class="image"><a href="#"><img src="HomePhoto.jpg" /></a></div>
        	        <div class="left">Onodaga, NY 13215 <br />1 Bed, 3 Bath</div>
        	        <div class="right">
        	            <span class="price">$111,900.00<br />
        	            <span class="details"><a href="#">View Details</a></span>
        	        </div>
                </div>
		        <div class="item">
		            <div class="image"><a href="#"><img src="HomePhoto.jpg" /></a></div>
        	        <div class="left">New York, NY 13215 <br />2 Bed, 5 Bath</div>
        	        <div class="right">
        	            <span class="price" >$2,511,900.00<br />
        	            <span class="details"><a href="#">View Details</a></span>
        	        </div>
                </div>
		        <div class="item">
		            <div class="image"><a href="#"><img src="HomePhoto.jpg" /></a></div>
        	        <div class="left">Scranton, PA 13215 <br />3 Bed, 2 Bath</div>
        	        <div class="right">
        	            <span class="price">$31,900.00<br />
        	            <span class="details"><a href="#">View Details</a></span>
        	        </div>
                </div>
		        <div class="item">
		            <div class="image"><a href="#"><img src="HomePhoto.jpg" /></a></div>
        	        <div class="left">Onodaga, NY 13215 <br />4 Bed, 3 Bath</div>
        	        <div class="right">
        	            <span class="price">$411,900.00<br />
        	            <span class="details"><a href="#">View Details</a></span>
        	        </div>
                </div>
		        <div class="item">
		            <div class="image"><a href="#"><img src="HomePhoto.jpg" /></a></div>
        	        <div class="left">Onodaga, NY 13215 <br />5 Bed, 3 Bath</div>
        	        <div class="right">
        	            <span class="price">$511,900.00<br />
        	            <span class="details"><a href="#">View Details</a></span>
        	        </div>
		        </div>
		        <div class="item">
		            <div class="image"><a href="#"><img src="HomePhoto.jpg" /></a></div>
        	        <div class="left">Onodaga, NY 13215 <br />6 Bed, 3 Bath</div>
        	        <div class="right">
        	            <span class="price">$611,900.00<br />
        	            <span class="details"><a href="#">View Details</a></span>
        	        </div>
		        </div>	       
	        </div>

	        <div class="ScrollBar">
                <a class="prevPage browse left"></a>
                
                 <!-- works as navigator for scrollable -->
                    <div class="navbar">
	                    <ul class="navi">
	                        <li>1</li>
	                        <li>2</li>
	                        <li>3</li>
	                        <li>4</li>
	                        <li>5</li>
	                        <li>6</li>
	                     </ul>
                    </div>
                <a class="nextPage browse right"></a>
                <div class="clear"></div>
            </div>
            <div class="clear"></div>     	
        </div>
        </div>     
    </div>
    </center>
</div>

<br class="clearit" clear="all" />
<br />
<div style="text-align:left;">Below</div>
<div>Below2</div>
</body>
</html>

Download in other formats:

Original Format