1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

How To Tracking Mouse Coordinate and Store into DB

Discussion in 'JavaScript' started by Mac Weng, Dec 13, 2005.

0
  1. #1
    hiii i am newbies here i need help to tracking a mouse coordinate in web page and store it...the problem now i dont know how can send it to db base as a value that i can set..let see ...i only need the mouse tracking only for 100 data for (x,y)..please someone help me


    using ==> document.getElementById("a").value

    and form field==> <input type='hidden' name='element[$i]' id='$i' value=''>

    i also need how can i save url for each page that user are browsing....for example.... index.php?menu....index.php?link and so on into DB..



    this is a java script to track mouse???

    can someone help me with this....this script is running but cannot get x&y to store or something....
     
    Mac Weng, Dec 13, 2005 IP
  2. Mac Weng

    Mac Weng Peon

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    why dont any one help me...please?????
     
    Mac Weng, Dec 14, 2005 IP
  3. Sham

    Sham Peon

    Messages:
    136
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #3
    in getMousePosition, store the x and y's for each call in 2 arrays. One called xMovements and one called yMovements

    When you click the submit button, set the value of your hidden fields to each array respectively. You will need to rename your hidden fields to elementX[] and elementY[]

    "Catch" the arrays in simpan.php in the usual manner, and magically, $elementsX and $elementsY will be populated as arrays...
     
    Sham, Dec 23, 2005 IP
  4. Mac Weng

    Mac Weng Peon

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Hii sham ....can u help me with example or show more specific...i dont really understand what u said...please...
     
    Mac Weng, Jan 3, 2006 IP
  5. Sham

    Sham Peon

    Messages:
    136
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Sure, basically you need 2 arrays in your javascript.
    One array will hold the x values, the other will hold the y values
    It is up to you to devise some clever way of only holding the relevant 10o points (I assume you want the first 100 movements or something).

    Anyway, once you have filled these 2 arrays with points, you need to send them to your php script.

    You can do this by creating 2 hidden fields in your HTML form as you have done.
    But, name one of them elementX[] and the other elementY[]

    Then, when you submit the form, you need to do something like document.forms[0].elements[0].value = xarray (your javascript array that holds x values)

    and

    document.forms[0].elements[1].value = yarray (your javascript array that holds y values)

    Now, because your form fields are named elementX[] and elementY[], when you submit them to your PHP form, you can do

    $elementX = $_POST['elementX[]'];

    And this gives you a PHP array containg x values....
     
    Sham, Jan 6, 2006 IP
  6. Mac Weng

    Mac Weng Peon

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    sham u give me simple coding example..please..
     
    Mac Weng, Jan 16, 2006 IP
  7. Mac Weng

    Mac Weng Peon

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7 
    

<html> 
<body> 

<script type=text/javascript> 
// Set Netscape up to run the "captureMousePosition" function whenever
// the mouse is moved. For Internet Explorer and Netscape 6, you can capture
// the movement a little easier.
if (document.layers) { // Netscape
    document.captureEvents(Event.MOUSEMOVE);
    document.onmousemove = captureMousePosition;
} else if (document.all) { // Internet Explorer
    document.onmousemove = captureMousePosition;
} else if (document.getElementById) { // Netcsape 6
    document.onmousemove = captureMousePosition;
}
// Global variables
xMousePos = new array(10); // Horizontal position of the mouse on the screen
elementx[0]="";
yMousePos = new array(10); // Vertical position of the mouse on the screen
elementy[1]="";
xMousePosMax = 0; // Width of the page
yMousePosMax = 0; // Height of the page

function captureMousePosition(e) {
    if (document.layers) {
        // When the page scrolls in Netscape, the event's mouse position
        // reflects the absolute position on the screen. innerHight/Width
        // is the position from the top/left of the screen that the user is
        // looking at. pageX/YOffset is the amount that the user has 
        // scrolled into the page. So the values will be in relation to
        // each other as the total offsets into the page, no matter if
        // the user has scrolled or not.
        xMousePos = e.pageX;
        yMousePos = e.pageY;
        xMousePosMax = window.innerWidth+window.pageXOffset;
        yMousePosMax = window.innerHeight+window.pageYOffset;
    } else if (document.all) {
        // When the page scrolls in IE, the event's mouse position 
        // reflects the position from the top/left of the screen the 
        // user is looking at. scrollLeft/Top is the amount the user
        // has scrolled into the page. clientWidth/Height is the height/
        // width of the current page the user is looking at. So, to be
        // consistent with Netscape (above), add the scroll offsets to
        // both so we end up with an absolute value on the page, no 
        // matter if the user has scrolled or not.
        xMousePos = window.event.x+document.body.scrollLeft;
        yMousePos = window.event.y+document.body.scrollTop;
        xMousePosMax = document.body.clientWidth+document.body.scrollLeft;
        yMousePosMax = document.body.clientHeight+document.body.scrollTop;
    } else if (document.getElementById) {
        // Netscape 6 behaves the same as Netscape 4 in this regard 
        xMousePos = e.pageX;
        yMousePos = e.pageY;
        xMousePosMax = window.innerWidth+window.pageXOffset;
        yMousePosMax = window.innerHeight+window.pageYOffset;
    }
    top.leftFrame.location='simpan.php?xMousePos=' + xMousePos + ' ,yMousePos=' + yMousePos + ', xMousePosMax=' + xMousePosMax + ' ,yMousePosMax=' + yMousePosMax;
    document.forms[0].elements[0].value = xMousePos 
    document.forms[0].elements[1].value = yMousePos
    return true; 

}

</script> 
<form submit="simpan.php" action="post">
<input type='hidden' name='elementx[]' value='xMousePos'>
<input type='hidden' name='elementy[]' value='yMousePos'>  

</body> 
</html>
    PHP:
    sham is my coding above have something wrong..because it still cannot get data...
     
    Mac Weng, Jan 16, 2006 IP