Return to Snippet

Revision: 51041
at September 13, 2011 05:02 by RichardCustance


Updated Code
<!DOCTYPE html>
<html>
<head>
	<title>Firehose</title>
</head>
<body>
    <header>
        <div id="title">
            <h1>Firehose</h1>
        </div>
    </header>
    <section id="main">
		<div id="test"></div>
		<div id="test2"></div>
    </section>
    
    <!-- Retreive  the JavaScript files we are dependent on from a Content Delivery Network (CDN) where possible -->
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.3.min.js" type="text/javascript"></script>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.16/jquery-ui.min.js" type="text/javascript"></script>
    <script src="Scripts/rx.js" type="text/javascript"></script>
    <script src="Scripts/rx.jQuery.js" type="text/javascript"></script>
    <script src="Scripts/firehose.js" type="text/javascript"></script>

    <script type="text/javascript">
    // Attach the "firehose" widget to the "test" div above:
    $("#test").firehose();
 
    // Without creating a new firehose widget, we can make another element (the "test2" div) 
    // subscribe directly to the other element's observable by accessing it through the "options" property:
    $("#test").firehose("option", "firehose").Subscribe(function (eventData)  	{
        $("#test2").text(eventData.offsetX + "," + eventData.offsetY);
    });
    </script>
</body>
</html>

Revision: 51040
at September 13, 2011 05:00 by RichardCustance


Initial Code
<!DOCTYPE html>
<html>
<head>
	<title>Firehose</title>
</head>
<body>
    <header>
        <div id="title">
            <h1>Firehose</h1>
        </div>
    </header>
    <section id="main">
		<div id="test"></div>
		<div id="test2"></div>
    </section>
        <!-- Retreive  the JavaScript files we are dependent on from a Content Delivery Network (CDN) where possible -->
	<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.3.min.js" type="text/javascript"></script>
	<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.16/jquery-ui.min.js" type="text/javascript"></script>
	<script src="Scripts/rx.js" type="text/javascript"></script>
	<script src="Scripts/rx.jQuery.js" type="text/javascript"></script>
	<script src="Scripts/firehose.js" type="text/javascript"></script>

	<script type="text/javascript">
	// Attach the "firehose" widget to the "test" div above:
	$("#test").firehose();
 
        // Without creating a new firehose widget, we can make another element (the "test2" div) 
        // subscribe directly to the other element's observable by accessing it through the "options" property:
	$("#test").firehose("option", "firehose").Subscribe(function (eventData)  	{
		$("#test2").text(eventData.offsetX + "," + eventData.offsetY);
	});
	</script>
</body>
</html>

Initial URL
http://www.sage.co.uk/devblog

Initial Description

                                

Initial Title
Sample Webpage consuming the mouseover events firehose jQuery UI widget

Initial Tags
javascript, jquery

Initial Language
HTML