Hi
First, I will ask "Do you have any JavaScript errors ?"
Manu
2012/4/4 Chris Mylonas <ch...@opencsta.org>
> Well if someone could relay this into the google group that would be great.
> I'm logged into google but cannot create a new topic :(
> pfft!
>
> Thanks
> Chris
>
> On 04/04/2012, at 4:12 PM, Chris Mylonas wrote:
>
> > Hi All,
> >
> > I'll post this in the google groups linked to the tapestry5-jquery
> project as well.
> > To repeat what I have done:
> >
> >
> > 1) Create a package under pages called test.
> > 2) Create class JQuery.java with this in it.
> >
> > package org.example.jquerytest.pages.test;
> >
> > import org.apache.tapestry5.annotations.Import;
> >
> >
> @Import(stylesheet="context:layout/mouseover.css",library={"context:js/mouseover.js"})
> > @ImportJQueryUI("jquery.ui.mouse")
> > public class JQuery {
> >
> > }
> >
> > 3. Create src/main/webapp/layout/mouseover.css with this in it.
> >
> > div.out { width:40%; height:120px; margin:0 15px;
> > background-color:#D6EDFC; float:left; }
> > div.in { width:60%; height:60%;
> > background-color:#FFCC00; margin:10px auto; }
> > p { line-height:1em; margin:0; padding:0; }
> >
> > 4. Create src/main/webapp/js/mouseover.js with this in it.
> >
> > var i = 0;
> > $("div.overout").mouseover(function() {
> > i += 1;
> > $(this).find("span").text( "mouse over x " + i );
> > }).mouseout(function(){
> > $(this).find("span").text("mouse out ");
> > });
> >
> > var n = 0;
> > $("div.enterleave").mouseenter(function() {
> > n += 1;
> > $(this).find("span").text( "mouse enter x " + n );
> > }).mouseleave(function() {
> > $(this).find("span").text("mouse leave");
> > });
> >
> >
> > 5. Create the template for the pages/test/JQuery.java file calling it
> pages/test/JQuery.tml
> >
> > <html t:type="layout" title="Contact org.example"
> > xmlns:t="http://tapestry.apache.org/schema/tapestry_5_3.xsd";
> xmlns:p="tapestry:parameter">
> >
> > <p>JQuery Testing</p>
> >
> > <div class="out overout">
> > <span>move your mouse</span>
> > <div class="in">
> > </div>
> > </div>
> >
> > <div class="out enterleave">
> > <span>move your mouse</span>
> > <div class="in">
> > </div>
> > </div>
> >
> >
> > </html>
> >
> >
> > The css and js files are included in the html source and i can view
> them, so they are there and jquery.ui.mouse.min.js is also included and
> viewable.
> >
> > MouseOver function as per the jquery example
> http://api.jquery.com/mouseover/ does not work though.
> >
> > Any ideas?
> >
> > Cheers
> > Chris
>
>
--
Emmanuel DEMEY
Ingénieur Etude et Développement
ATOS Worldline
+33 (0)6 47 47 42 02
demey.emman...@gmail.com
http://emmanueldemey.fr
Twitter : @gillespie59
