[Cancel mousedown/move events with mouseup event]

Has anyone actually created something like this successfully without jquery?

[Cancel mousedown/move events with mouseup event]

Cool ill give that a go, so what understand from that is i create a document.onmousedown & onmouseup  and detect inside the down function see if cropDiv was clicked in the process.

 

In theory this will keep my current code working too as the moveable div's top left style depends on the difference in location from wen i called mousedown and compare it to the current mouse position inside the parent div in the mousemove function.

[Cancel mousedown/move events with mouseup event]

I know i could just use jquery but I dont know how to write jquery plus i like the feeling of coding this independently. I have the div moving fine inside of the parent div just cant cancel the mousedown function which moves the div which im sure is quite simple to end.

 

The whole idea of this is for cropping images for thumbnails for a friends shop.

[Cancel mousedown/move events with mouseup event]

Hey,

 

Im trying to create a div which is movable only inside its parent div but before i can really test my code to see if it wants to keep to the restrictions i need to be able to cancel the mousedown/move mouse event that make the child div move.

 

At the moment I can release my mouse and the div still follows it, the code is a bit long but the mouse event structure that calls the needed functions is like so..

 

Thanks team

 

eventHandling();
cropDiv = document.getElementById("cropDiv"); // is global variable created in previous function that creates div dimensions.

function eventHandling(){
cropDiv.onmousedown = OnMouseDown;
cropDiv.onmouseup = OnMouseUp;
}

function OnMouseUp(e){
     document.onmousemove = null;
      document.onmousemove = null;
      document.onmouseup = null;
  return false;
}

function OnMouseDown(e){
//Mouse movement code "Not relevant"
       cropDiv.onmousemove = OnMouseMove;
}

[how to write variables the correct way in your code? (javascript)]

// Call Function
my_function_name(var1, var2);

//Create Variables
var var1= "Variables";
var var2 = "Joined";

// Note that the function call  can have different variable names the to the function itself ie var1 = t1 and var2 = t2 inside the called function.
function my_function_name(t1,t2){
var t3 = t1+" "+t2;
// popup will display "Variables Joined"
alert(t3);
}
</script>

 

creating t3 shows you how to join variables with the + sign and " " displays the gap between the variables or they would join together.

[Cant use math addition on two variables.]

Try using the parseInt() function to force both numbers to be Ints before adding them.

 

worked like a charm, thanks for that

[Cant use math addition on two variables.]

Thanks for the reply,

 

All the variables have been called globally just to reduce clutter, but imgDiv is the name of the div i want to get the mouse xy position.

[Cant use math addition on two variables.]

Hey,

 

I have two variables which both hold different integer values that i would like to use addition on and make the answer into a new variable but due to js function that adds variables together with a + I cant seem to to use math addition on the two variables.

 

Note: One variable is an array but in previous function subtraction worked fine in same situation

 

Below is the snippet of the code that wont work.

 

Thanks team

 

function OnMouseDown(e){
imgDivPos = new imagePosition(imgDiv);
mCurrentX = e.pageX + imgDivPos[0];
mCurrentY = e.pageY + imgDivPos[1];
alert(mCurrentY);
    cropDiv.onmousemove = OnMouseMove;	

}

function imagePosition(param){
var x=0, y=0;
x = param.offsetLeft;
y = param.offsetTop;
this[0] = x;
this[1] = y;
}

[Javascript PHP or CSS Issue in the Navagation Bar? HELP]

By the way im pretty sure search engines like google/yahoo dont use meta keyword anymore.

[Div width won't change from JS]

Looks fine to me, all I can suggest is to debug the script by calling an alert with percentage variable in that function to see if the script even makes it to it?

[Retreiving mouse position inside a div on mousedown?]

Hey man

 

I'm not a fan of jquery when I'm trying to advance my javascript coding but thanks for the link I would be lying if i didnt think of taking that route though if it got too hard.

 

I have go all the mouse positioning figured out inside the required divs and got the div moving using onmousedown function which then fires onmousemove of the div but I cant figure out how to stop the div moving once onmouseup is fired.

 

I dont know how to stop the mousedown & mousemove function from firing after onmouseup event is done any thoughts.

 

Thanks a lot

 

// Mouse events

function eventHandling(){
    var movingDiv = document.getElementById("movingDiv");
    // Mouse move is fired inside downFunction
    movingDiv.onmousedown = downFunction;
    movingDiv.onmouseup = upFunction;

}

window.onload = function(){
eventHandling();
}

 

 

[Retreiving mouse position inside a div on mousedown?]

Hey,

 

I havent touched mouse events yet and cant find any good tutorials with mouse event etc related syntax.

 

I need to get the mouse x & y position while over a div and be able to move a child div within the parent div with the mouse.

 

<div id="parentDiv">
<div id="childDiv">
</div>
</div>

 

Thanks

[getElementById(errors[i]).style.border]

Hey,

I havent done much in the way off css manipluation with javascript but one way I did it was by...

 

document.getElementById(errors).className = "ClassID";

 

So you have another css class with the changes you want then change the elements class.

Longer way just i havent used much js style etc.

[How to restrict access to html pages?]

Yeah thats just what i was thinking of doing too.

 

Even if it was impossible to disable JS in the browser settings, it's still code ran on the client's machine and is therefore not trustworthy. Anything from the client can be manipulated.

 

I know that its more for functionality, as so many web developers are using js in there sites these day for forms etc you would hope for the users sake that they had it automaticlly when browsing as to not inhibit their browsing experience

[Button won't enable]

Ok, i assumed all you wanted to do now was retrieve a value from a option tag and check the value is yes? I just gave you a dynamic way of check but you can make it more direct by removing the for loop.

 

PS,

More direct approach by selecting option from its array.

 

var s1 = document.getElementById("s1")
s1.onchange = function(){
if (s1.options[1].selected){
	var optionVar = s1.options[1].value;
}else{
                var optionVar = null;
        }
}

 

The 1 corresponds the position of the option inside the select tag starting a 0.

[Button won't enable]

Your issue is that the statement below the element doesnt have a value as you have targetted the select tag and not the options tags inside it do.

 

if (document.getElementById("agree").value == "Yes")

 

just implement my snippet of code into your script and it will work. Basically it runs through all the option tags inside the select with a for loop and IF the option is selected and the value is value yes only then will the code go on or in my case alert u.

[Hide/Show Elements]

Just going to throw it out there but maybe it doesn't support style.display table_row etc?

have you tried display block none etc or you could ad classes to affected rows with a hidden and displayed class that u could change etc?

[Button won't enable]

Heres a way to check select options and only alerts if yes is selected

 

<html>
<head>
<title>Untitled Document</title>
<script type="text/javascript">
window.onload = function(){
var s1 = document.getElementById("s1")
s1.onchange = function(){
for(var i = 0; i < s1.options.length; i++){
	if(s1.options[i].selected && s1.options[i].value == "yes"){
		value = s1.options[i].value;
		alert(value);
	}
}
}
}
</script>
</head>
<body>
<form>
<select id="s1">
<option>---</option>
<option value="yes">yes</option>
<option>no</option>
</select>
</form>
</body>
</html>

[Button won't enable]

are u sure that "disabled" attribute works correctly?

[Button won't enable]

Try AJAX, Im not totaly sure but js and php dont work hand in hand like that.

[How to restrict access to html pages?]

Why dont they build javascript into browsers cause i keep thinking about disabling javascript while using a form could disrupt js validation.

[How to restrict access to html pages?]

Php is far more secure and I can easily disable the page if post variables arent valid that are required for the form.

[How to restrict access to html pages?]

Hey,

 

What i mean by this is if i have a form that needs information before form pages is requested i dont want people to be able to access form by directly accessing page from its url.

If after form is sent that a error will pop up if user clicks back in browser etc?

 

I just want form page to be accessed only by page1. do i need to create a annon id for each user? or just a function that checks previous page url somehow?

 

"page1->Form>page3"

 

Thanks

 

 

[Form wont submit? Cant figure out why.]

WOOT I solved it. For anyone who wants to know lol it was the pattern attribute i added to inputs was clashing with some html/browser syntax. The reason the page was working with at the last div was due to it not checking the inputs with pattern attribute.

[Form wont submit? Cant figure out why.]

Note: Form submits if u change the 1st div class to disabledForm and 4th too activeForm and display submit. This allows the form to submit without going through all hidden divs input if i don't validate them.