✔ [jQuery] Popup Window für Login (Autoload)?

[mOnis]

Moin,

ich möche eine Login Popup mit Js realisieren, klappt alles soweit. Nur möchte ich, dass wenn ich auf mein Button klicke die login.php aufgerufen wird und das dann das Popup Window sofort aufgeht ohne das man auf ein Link klicken muss.

DivButton auf meiner php-Index Site

        		<div onclick="window.location = '/blahblah/login.php';">
                	Login
              	</div>

login.php

    <a href="#dialog" name="jwindow">Login TEST Window</a>
    <div id="boxes">
        <div id="dialog" class="window">
            <b>Testing the Login-Window</b> |
             
            <a href="/blahblah/index.php" class="close">Close</a>
        </div>
     
        <div id="mask"></div>
    </div>
<?php include('index.php'); ?>

und die function.js

$(document).ready(function() {
	
	//select all the a tag with name equal to the window
	$('a[name=jwindow]').click(function(e) {
		//Cancel the link behavior
		e.preventDefault();
		//Get the A tag
		var id = $(this).attr('href');
	 
		//Get the screen height and width
		var maskHeight = $(document).height();
		var maskWidth = $(window).width();
	 
		//Set height and width to mask to fill up the whole screen
		$('#mask').css({'width':maskWidth,'height':maskHeight});
		 
		//transition effect    
		$('#mask').fadeIn(1000);   
		$('#mask').fadeTo("slow",0.8); 
	 
		//Get the window height and width
		var winH = $(window).height();
		var winW = $(window).width();
			   
		//Set the popup window to center
		$(id).css('top',  winH/2-$(id).height()/2);
		$(id).css('left', winW/2-$(id).width()/2);
	 
		//transition effect
		$(id).fadeIn(2000);
	});
	 
	//if close button is clicked
	$('.window .close').click(function (e) {
		//Cancel the link behavior
		//e.preventDefault(); // Disable the LINK
		$('#mask, .window').hide();
	});    
	
	//if mask is clicked
	$('#mask').click(function () {
		$(this).hide();
		$('.window').hide();
	});        
});

Da muss man einfach eine Onload Function einbauen, denke ich. Wenn ich <a href="#dialog" name="jwindow">Login TEST Window</a> aus der login.php rausnehme muss ich die ID: #dialog und den die function: jwindow irgendwie ansprechen, ich habe aber kein Plan wie ich das mache.

Nochmal kurz: Wenn ich in der Index.php auf Login klicke soll die login.php aufgehen und das Javascript Popup sofort kommen, ohne dass ich auf ein Link klicken muss. Also muss die ID=dialog und name=jwindow einfach onload geladen werden.

PS: Die Seite ansich ist etwas komplexer aufgebaut, das sind nur Auszüge, die ausreichen sollten damit ihr mir helfen könnt

Vielleicht kann mir ja einer helfen.

Grüße
mOnis

 

[javaDeveloper2011]

Hi,

könnte es nicht einfach gehen, indem du

 //select all the a tag with name equal to the window
    $('a[name=jwindow]').click(function(e) {
        //Cancel the link behavior
        e.preventDefault();

und am Ende 1x

});

rausnimmst?

Dann muss er den Code, den er sonst erst beim Klick auf den Link ausführt doch sofort ausführen, oder?

 

[mOnis]

Das Problem ist, wenn man das macht, dass ich dann nur ein Schwarzes Window bekomme ohne den Inhalt den ich im der Login.php definiert habe:

<div id="boxes">
        <div id="dialog" class="window">
            <b>Testing the Login-Window</b> |
             
            <a href="/blahblah/index.php" class="close">Close</a>
        </div>

Ich muss da jetzt nur noch irgendwie den Div mit der ID dialog reinkriegen, dann ist alles top Hast du eine Idee?

Update: Habe es anders gelöscht, habe es komplett umgebaut. Wenn ich jetzt die Antwort schreibe blickt eh keiner mehr durch ^^.