Jump to content

Stickybomb

Members
  • Posts

    133
  • Joined

  • Last visited

    Never

Posts posted by Stickybomb

  1. you need to use ajax.

     

    depending on how you wish to use it, it will be different. you can right it completely in js or use a server language like php/asp to precess the response.

     

    for this you could probably et away with just js depends on how much changes and what not. you need too files though one containing the ajax call function, witch is attached to the dropdown menu like so

     

    <select name="menu" id="menu" onchange="ajax(this.value);">
    <option>choose</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    </select>
    

     

    then you need a seperate file in what ever language you prefer to determine what is showed in the specified container based on the value

     

    so first you need a container like so

     

    <div id="response">
    <!--Nothing here to begin with-->
    </div
    

     

    ok then in your ajax function you use the id for this div and update it witht he response from your request process file

     

    so your ajax file would look like this

     

    var xmlHttp
    
    function show(str)
    { 
    xmlHttp=GetXmlHttpObject()
    if (xmlHttp==null)
    {
    alert ("Browser does not support HTTP Request")
    return
    } 
    //this is the path to the process file
    var url="process.php"
    url=url+"?value="+str
    url=url+"&sid="+Math.random()
    xmlHttp.onreadystatechange=stateChanged 
    xmlHttp.open("GET",url,true)
    xmlHttp.send(null)
    }
    
    function stateChanged() 
    { 
    if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
    { 
    
    //the id for the containing div goes here
    document.getElementById("response").innerHTML=xmlHttp.responseText 
    } 
    }
    
    function GetXmlHttpObject()
    {
    var xmlHttp=null;
    try
    {
    // Firefox, Opera 8.0+, Safari
    xmlHttp=new XMLHttpRequest();
    }
    catch (e)
    {
    //Internet Explorer
    try
      {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
    catch (e)
      {
      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    }
    return xmlHttp;
    }
    

     

    no for the processing and result i prefer to use php so your file would look like this

     

    <?php
    switch($_GET['value']) {
    case '1':
    echo '<textarea name="comment" id="comment" cols="45" rows="5"></textarea>';
    break;
    case '2':
    echo '<input name="radio" type="radio" value="" />';
    break;
    case '3':
    echo '<input type="submit" name="help" id="help" value="Submit" />';
    break;
    case '4':
    echo '<input type="text" name="name" id="name" />';
    break;
    ?>
    

     

    this is all kinda basic and not test but should work and you should be able to make some customizations pretty easily

  2. onblur is needed for what im trying to do. as for the onComplete is result a variable that is returned or am i supposed to know what to put there cause that is what i am looking for. the documentation is confusing on this. it lists a way to get headers but that is not what i am affter is it?

  3. hi i am working on a mootools script for an ajax call to validate some forms. I need to be able to check what is returned and update accordingly.

     

    like if it returns false display i would execute an error effect, if not i will display a check mark

     

    so i guess i just need to know how to check the results of the response

     

    this is what i have so far

    $('pass').addEvent('blur', function(e) {
                        new Event(e).stop();
                        new Ajax('includes/process/register.php?field=pass&data='+$('pass').value, {
    					method: 'get',
    					//what next
    					}).request();
                    });

     

    any help pls

  4. i am try to create a simple script that will read a directory, get the images in it and write them to the page. It would also seperate them in to multiple pages. This is what i have so far

     

    gal.php

    <?php
    $limit=5;
    
    function returnimages($dirname) {
       $pattern="\.(jpg|jpeg|png|gif|bmp)$";
       $curimage=0;
       if($handle = opendir($dirname)) {
           while(false !== ($file = readdir($handle))){
                   if(eregi($pattern, $file)){
                     $galleryarray[$curimage]=$file;
                     $curimage++;
                   }
           }
    
           closedir($handle);
       }
       return($galleryarray);
    }
    ?>
    

     

    page to display the images

    <?php
    include('gal.php');
    if(isset($_GET['year'])){$year=$_GET['year'];}else{$year=2001;}
    $image = array();
    $image = returnimages('IFAIphotos/'.$year);
    $limit = 5;
    $images = count($image);
    $totalrows = ceil($images/2);
    $numofpages = ceil($totalrows / $limit);
    if(isset($_GET['page'])){$page=$_GET['page'];}else{$page=1;}
    $limitvalue = ($page-1) * $limit;
    ?>
    
    <p align="center"><img src="IFAIphotos/<?=$year;?>/<?=$year;?>_logo.jpg" alt="IFAI <?=$year;?>" /></p>
    <?php
    for($i=1;$i==$images;$i++){
    echo '<p align="center"><img src="IFAIphotos/'.$year.'/'.$image[$i].'" alt="1" width="150" hspace="5" />';
    $i++;
    echo '<p align="center"><img src="IFAIphotos/'.$year.'/'.$image[$i].'" alt="1" width="150" hspace="5" /></p>';
    }
    ?>
    <p align="center"><span class="pagenav">
    <?php
    if($numofpages!=1){
    if($page!=1){
    	$pageprev = ($page-1);
    	echo '<a href="preevent.php?year='.$year.'&page='.$pageprev.'">PREV</a> ';
    }															
    for($i = 1; $i <= $numofpages; $i++){
    	if($i == $page){
    		echo($i." ");
    	}else{
    		echo('<a href="preevent.php?year='.$year.'&page='.$i.'">'.$i.'</a> '); 
    	 }        
    }
    if(($totalrows - ($limit * $page)) > 0){ 
    	$pagenext = ($page+1);
    	echo('<a href="preevent.php?year='.$year.'&page='.$pagenext.'">NEXT</a>');
    }else{
    	echo(""); 
            }
    }
    ?>
    

     

    basically the problems i am having are

    1. i can not seem to get the filename for each image. The for loop to echo the images displays nothing

    2. I know how to do it using a database driven system but am stumped on how to limit the rows of images per page for it to be pageinated.

     

    can someone please lend some assistence on this

     

    thanks ;)

     

  5. Not really sure where this would fall under categories, so ill try it here

     

    ok am i all familiar with the use of conditionals to fix rendering issues with all IE browsers. I am wondering if conditionals able to determine if it is IE and differentiate between versions, or is there conditionals to test for other specific browsers.

     

    for example lately i have been having issues with safari and would like to be able to use conditionals to write specific code for only safari or firefox.

     

    Are there conditionals to test for this or another way to test for the specific browser i am trying to affect without the use of lengthy javascript or php code.

     

    if anyone knows of any methods or what not pls let me know or direct me in the right direction

     

    peace

    Sticky

  6. ok i am working on a form and need to provide the ability to attach an image in the mail that will be sent. for some reason though it is not sending the mail

     

    <?php
    //initalized form variables
    $firstname='';
    $lastname='';
    $mailing='';
    $shipping='';
    $phone='';
    $fax='';
    $email='';
    $contactname='';
    $company='';
    $comments='';
    $quantity='';
    
    //header check array
    $check = array("%0A", "%0D", "bcc:", "cc:", "mime-type:", "content-type:", "from:", "to:", "Bcc:", "Cc:", "Mime-Type:", "Content-Type:", "From:", "To:", "\\r", "\\n", "\\" );
    $error=0;
    
    if(isset($_POST['submitted']) == "yes"){
    
    if(!empty($_POST['firstname'])){$firstname = $_POST['firstname'];}else{$firstname='';}
    if(!empty($_POST['lastname'])){$lastname = $_POST['lastname'];}else{$lastname='';}
    if(!empty($_POST['mailing'])){$$mailing = $_POST['mailing'];}else{$mailing='';}
    if(!empty($_POST['shipping'])){$shipping = $_POST['shipping'];}else{$shipping='';}
    if(!empty($_POST['phone'])){$phone = $_POST['phone'];}else{$phone='';}
    if(!empty($_POST['fax'])){$fax = $_POST['fax'];}else{$fax='';}
    if(!empty($_POST['contactname'])){$contactname = $_POST['contactname'];}else{$contactname='';}
    if(!empty($_POST['company'])){$company = $_POST['company'];}else{$company='';}
    if(!empty($_POST['quantity'])){$quantity = $_POST['quantity'];}else{$quantity='';}
    if(!empty($_POST['comments'])){$comments = $_POST['comments'];}else{$comments='';}
    
    //check for injections
    $firstname = str_replace($check, "", $firstname);
    $lastname = str_replace($check, "", $lastname);
    $mailing = str_replace($check, "", $mailing);
    $shipping = str_replace($check, "", $shipping);
    $phone = str_replace($check, "", $phone);
    $fax = str_replace($check, "", $fax);
    $contactname = str_replace($check, "", $contactname);
    $company = str_replace($check, "", $company);
    $quantity = str_replace($check, "", $quantity);
    $comments = str_replace($check, "", $comments);
    
    if (eregi('<a href',$firstname)){$error=1;}
    if (eregi('<a href',$lastname)){$error=1;}
    if (eregi('<a href',$mailing)){$error=1;}
    if (eregi('<a href',$shipping)){$error=1;}
    if (eregi('<a href',$phone)){$error=1;}
    if (eregi('<a href',$fax)){$error=1;}
    if (eregi('<a href',$contactname)){$error=1;}
    if (eregi('<a href',$company)){$error=1;}
    if (eregi('<a href',$quantity)){$error=1;}
    if (eregi('<a href',$comments)){$error=1;}
    
    if($error!=1){
    //create message
    $to='mike@whitemyer.com';
    $subject='Quote Request';
    $message=
    "The following quote request was submitted:\n
    First Name - ". $firstname . "\n
    Last Name - ". $lastname . "\n
    Company - ". $company . "\n
    Mailing Address - ". $mailing . "\n
    Shipping Address - ". $shipping . "\n
    Phone - ". $phone . "\n
    Fax - ". $fax . "\n
    E-Mail - ". $email . "\n
    Contact Name - ". $contactname . "\n
    Quoe Quantity - ". $quantity . "\n
    Comments - " . $comments."\n";
    
    $fileatt = $_FILES['fileatt']['tmp_name']; 
    $fileatt_type = $_FILES['fileatt']['type']; 
    $fileatt_name	= $_FILES['fileatt']['name'];
    
    $headers = 'From: '.$company ."\r\n";
    $headers .= 'Bcc: ';
    $headers .= 'Cc: ';
    
    if (is_uploaded_file($fileatt)) {
    $file =fopen($fileatt,"rb");
    $data = fread($file,filesize($fileatt));
    fclose($file);
    
    $semi_rand = md5(time());
    $mime_boundary = "==Multipart_Boundary_x{".$semi_rand."}x"; 
    
    $headers .= "\nMIME-Version: 1.0\n" . "Content-Type: multipart/mixed;\n" . " boundary=\"{".$mime_boundary."}\"";
    $message = "This is a multi-part message in MIME format.\n\n" .
    "--{".$mime_boundary."}\n" . 
    "Content-Type: text/plain; charset=\"utf-8\"\n" .
    "Content-Transfer-Encoding: 7bit\n\n" . 
    $message . "\n\n";
    
    $data = chunk_split(base64_encode($data));
    $message .= "--{".$mime_boundary."}\n" .
    "Content-Type: {".$fileatt_type."};\n" .
    " name=\"".$fileatt_name."\"\n" . 	
    "Content-Disposition: attachment;\n" . 
    " filename=\"".$fileatt_name."\"\n" . 
    "Content-Transfer-Encoding: base64\n\n" . 
    $data . "\n\n" . 
    "--{".$mime_boundary."}--\n";
    }
    //send results
    $ok=@mail($to, $subject, $message, $headers); 
    
    if ($ok) { 
    echo "<p>Thank you! Your request has been successfully submited.</p>"; 
    } else { 
    echo "<p>Request could not be sent. Sorry! (01)</p>"; 
    } 
    }else{
    echo "<p>Request could not be sent. Sorry! 02</p>"; 
    }
    //Else display form
    

     

    i am getting the error msg i created with the (01) appended to it which implies that the ok variable is not recieving a value it is the exact same method i am using on another form i created which works fine, the only difference is the fields them self the other one has less fields then this one.

     

  7. thks for the link that is probaly the most detail source i have seen helped alot. only problem i am having now is that i can not get it to show up horizontal in ie6.

     

    I have tried changing everythin that i floated to display:inline-block with no luck

     

    here is what i have

     

    main css

    .nav {
    position:relative;
    float:left;
    top:.2em;
    width:100%;
    }
    
    .nav ul /* settings for all levels */ {
    cursor:pointer;
    float:left;
    list-style-type:none;
    margin:0;
    padding:0;
    }
    
    .nav ul li {
    height:22px;
    margin:0 0 0 1.4em;
    padding:0 .3em;
    }
    
    .nav ul li h2 {
    margin:0;
    padding:0;
    }
    
    .nav ul ul li,.nav ul ul ul li {
    margin:0;
    }
    
    .nav li {
    position:relative;
    }
    
    .nav ul ul {
    display:none;
    left:0;
    position:absolute;
    top:100%;
    }
    
    .nav ul ul ul {
    display:none;
    left:100%;
    position:absolute;
    top:0;
    }
    
    .nav ul ul li {
    background:#000;
    height:auto;
    padding:.2em .3em;
    text-align:left;
    width:15em;
    }
    
    .nav ul ul ul li {
    background:#000;
    color:silver;
    height:auto;
    padding:.2em .3em;
    text-align:left;
    width:8em;
    }
    
    .nav ul li a,.nav li h2 {
    color:#FFF;
    font-family:veranda,arial,helvetica;
    font-size:12px;
    font-weight:bolder;
    text-decoration:none;
    }
    
    .nav li:hover {
    background:#000;
    }
    
    .nav ul ul li.sub,.nav ul ul li.sub:hover {
    background-image:url("images/sm-Arrow.png");
    background-position:right 50%;
    background-repeat:no-repeat;
    }
    
    .nav li img {
    margin-top:-0.2em;
    }
    
    .nav ul ul ul li a,.nav ul ul li a {
    color:silver;
    font-family:veranda,arial,helvetica;
    font-size:11px;
    font-weight:bolder;
    text-decoration:none;
    }
    
    .nav li:hover .lvl2,.nav ul ul li:hover .lvl3 {
    display:block;
    }
    
    .nav ul ul li:hover,.nav ul ul ul li:hover {
    background:#848282;
    }
    
    .nav ul ul li:hover a,.nav ul ul ul li:hover a {
    color:#FFF;
    }
    

    ie6 css

    body {
    behavior: url('iehover.htc');
    }
    
    .nav {
    position:relative;
    float:none;
    top:0;
    width:100%;
    }
    
    .nav ul {
    display: inline-block;
    float:none;
    }
    

     

    any assitence with this would be great thks

     

    sticky

  8. telling me to google something is not exactly helpfull this is based off of hat i have learned researching suckerfish i am looking for any guidence on  the matter since suckerfish documentation is limited in the sence of multi- level from what i can find.

     

    This is the second time you have responded to my post telling me to google something i consider this spam just for your reference and will report you should it happen again

  9. hi i am trying to create a menu for a website i am working on and am running into some problems along the way

     

    here is the code

    <style type="text/css">
        .menubar, .lvl2, .lvl3
        {
          padding: 0;
          margin: 0;
          cursor:pointer;
          list-style-type: none;
        }
        .menubar li {
        	background: #cccccc;
        	padding: 0 3px;
        	text-align:center;
        	float:left;
        	margin-left:7px;
        }
        .lvl2 {
        	display: none;
        	position:relative;
        	float:left;
        }
        .lvl3 {
        	display:none;
        	position:relative;
        	float:right;
        }
         .lvl2 li {
        	background: #000000;
        	padding: 0 3px;
        	text-align:left;
        	float:none;
        }
        .lvl3 li {
        	background: #000000;
        	padding: 0 3px;
        	text-align:left;
        	float:none;
        } 
        .menubar li a{
        	font-family:veranda,arial,helvetica;
        	font-size:12px;
        	font-weight:bolder;
        	text-decoration:none;
        	color:#FFF;
        }
        .lvl2 li a{
        	font-family:veranda,arial,helvetica;
        	font-size:12px;
        	font-weight:bolder;
        	text-decoration:none;
        	color:#848282;
        }
        .lvl3 li a{
        	font-family:veranda,arial,helvetica;
        	font-size:12px;
        	font-weight:bolder;
        	text-decoration:none;
        	color:#848282;
        }
    .menubar li:hover {
    	background: #000000;
    }
    .menubar li:hover .lvl2 {
    	display:block;
    }
    .lvl2 li:hover .lvl3 {
    	background: #000000;
    	display:block;
    }
    .lvl2 li:hover {
    	background: #848282;
    }
    .lvl3 li:hover {
    	background: #848282;
    }
    .lvl2 li:hover a {
    	color: #FFFFFF;
    }
    .lvl3 li:hover a {
    	color: #FFFFFF;
    }
      </style>
      
      <!--[if lte IE 6]>
        <style type="text/css">
          body
          {
            behavior: url('csshover2.htc');
          }
          
          #menubar ul li a
          {
            /*display: inline-block;*/
          }
        </style>
      <![endif]-->
    </head>
    
    <body>
      <p>Below you should see a CSS driven menu bar.</p>
    
      
    					<ul class="menubar">
    						<li><a href="">HOME</a></li>
    
    						<li><a href="">ABOUT</a>
    							<ul class="lvl2">
    								<li><a href="">History/Timeline</a></li>
    								<li><a href="">Contact Info</a></li>
    								<li><a href="">Quality Policy</a></li>
    							</ul>
    						</li>
    
    						<li><a href="">PRODUCTS</a>
    							<ul class="lvl2">
    								<li class="sub"><a href="">New Products</a>
    									<ul class="lvl3">
    										<li><a href="">Pricing</a></li>
    										<li><a href="">Specs</a></li>
    										<li><a href="">Get Demo</a></li>
    									</ul>
    								</li>
    								<li><a href="">Used/Company Resale</a></li>
    								<li><a href="">Attachments</a></li>
    								<li><a href="">The See In Action</a></li>
    								<li><a href="">Parts</a></li>
    							</ul>
    						</li>
    
    						<li><a href="">COMPANY STORE</a></li>
    
    						<li><a href="">SALES</a>
    							<ul class="lvl2">
    								<li><a href="">Account Mgrs</a></li>
    								<li><a href="">Global Sales & Distribution</a></li>
    								<li><a href="">North American Distributors</a></li>
    								<li><a href="">Industrial Sales & Distribution</a></li>
    							</ul>
    						</li>
    
    						<li><a href="">SERVICE &AMP; SUPPORT</a>
    							<ul class="lvl2">
    								<li class="sub"><a href="">Parts</a>
    									<ul class="lvl3">
    										<li><a href="">General Info</a></li>
    										<li><a href="">Documents</a></li>
    									</ul>
    								</li>
    								<li class="sub"><a href="">Warranty</a>
    									<ul class="lvl3">
    										<li><a href="">General Info</a></li>
    										<li><a href="">Documents</a></li>
    									</ul>
    								</li>
    								<li><a href="">Sales & Distribution</a></li>
    								<li><a href="">Training</a></li>
    								<li class="sub"><a href="">Distributor Tools</a>
    									<ul class="lvl3">
    										<li><a href="">GPS</a></li>
    										<li><a href="">Company Plus</a></li>
    									</ul>
    								</li>
    							</ul>
    						</li>
    
    						<li><a href="">COMPANY OWNERS</a>
    							<ul class="lvl2">
    								<li><a href="">Warranty Info</a></li>
    								<li><a href="">E-News Signup</a></li>
    								<li><a href="">Faqs</a></li>
    							</ul>
    
    						<li><a href="">EMPLOWMENT</a></li>
    
    						<li><a href="">FAQS</a></li>
    
    						<li><a href="">CONTACT INFO</a></li>
    					</ul>
    </body>
    
    </html>
    

     

    the problems i am running into, first off i have provided a picture of what the menu should look like.

     

    menu.png

     

    problems

     

    * the first or main level needs to be elastic by the text with a 3px padding on either side, when you hover i do not want it to expand to the width of the sub level menu

     

    *i want the items in the sub levels to entirely change color when you mouse over them

     

    *lastly i need to get the third lvl to show to the right of the item selected in the second lvl

     

    you should note that all the items are to be controlled by the size of the text with 3px padding no set widths

     

    can anyone please give me some help or guidence with this i am trying everything i can think of with little or no luck.

     

    thks stickybomb

  10. ok i am having problems trying to create a simple ul menu with css

     

    exp:

     

    HTML

    <ul class="menu">
        <li><a href="/">Test link #1</a>
            <ul>
                <li><a href="/">Submenu link #1</a></li>
                <li><a href="/">Submenu link #2</a></li>
            </ul>
        </li>
    
        <li><a href="/">Test link #2</a>
                <ul>
                    <li><a href="/">Submenu link #3</a></li>                
                    <li><a href="/">Submenu link #4</a></li>                
                    <li><a href="/">Submenu link #5</a></li>                                
                </ul>
         </li>
    </ul>
    

     

    basically i am just trying to grasp the idea of how it works, i have done them using javascript before but would like to learn how to do it with only css. i know css so i can format the text and background colors and background hovers. My main problem is that i can not seem to figure out how you hide and display the menu using only the hover, if anyone could explain this to me  it would help alot.

     

    my attempt

     

    CSS

    .menu,.menu ul { list-style : none; }
    .menu {font-family:veranda; font-weight:bolder;font-size:12px; color:white;}
    .menu ul {display:none;}
    .menu li {background:#7f8fbf; display:inline;}
    .menu li:hover {background:#7f80b0;}
    .menu li:hover ul {display:box;}
    .menu il ul li:hover {background:#7f80b0;}
    

  11. ok i followed there documentation word for word but it does not upload the images. it gives me the message saying that the image has been uploaded but nothing is in the upload directory when i check it.

    some information about my installation

     

    i have the fck main folder in my admin/functions folder and the upload folder in the directory above that as follows

     

    root/admin/functions/fckeditor <-- installation folder

    root/admin/uploads <-- my uploads folder

     

    the installation is running through php

     

    i made the edits in the documentation the the following

     

    in the following directory
    root/admin/functions/fckeditor/editor/filemanager/browser/default/connectors/php
    
    i made the following changes to config.php
    
    $Config['Enabled'] = true ;
    $Config['UserFilesPath'] = 'uploads/' ;
    $Config['UserFilesAbsolutePath'] = 'root/admin/uploads' ;
    

     

     

    i made the edits in the documentation the the following

     

    in the following directory
    root/admin/functions/fckeditor/editor/filemanager/upload/php/
    
    i made the following changes to config.php
    
    $Config['Enabled'] = true ;
    $Config['UserFilesPath'] = 'uploads/' ;
    $Config['UserFilesAbsolutePath'] = 'root/admin/uploads' ;
    

     

    i made the edits in the documentation the the following

     

    in the following directory
    root/admin/functions/fckeditor/
    
    i made the following changes to fckconfig.js
    
    var _FileBrowserLanguage        = 'php' ;
    var _QuickUploadLanguage        = 'php' ;
    

     

    these were all the changes maped out in th wiki and i made all of them yet the upload does not work if anyone can assit me with this it would be a big help.

     

  12. thats what i tried and it did not work if you look at my code bascially i find the width of the browesr and the height and divide them in half to get the center coords then subtract half the width of the div from the width to center it horizontally and add the scrolloffset to the height to get the vertical position and pass them to the top and left values of hte div but for some reason it is not working the div is still placed at the top of the page

     

    function stateChanged() 
    { 
    if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
    {
    if (window.innerWidth){
    var xpos = window.innerWidth/2;
    var ypos = (window.innerHeight/2)+window.pageYOffset;
    }
    if (document.all){
    var xpos =  document.body.clientWidth/2;
    var ypos =  (document.body.clientHeight/2)+document.body.scrollTop;
    }
    xpos = xpos - (document.getElementById("viewer").style.width/2);
    //xpos = xpos - (document.getElementById("viewer").style.width/2);
    document.getElementById("viewer").style.left=xpos+"px";
    document.getElementById("viewer").style.top=ypos+"px";
    document.getElementById("viewer").innerHTML=xmlHttp.responseText 
    } 
    }
    

  13. ok i want to display a div in the absolute center of the page no matter where the page is. lets say that the page is realy long and dispite how far down they are i want to be able to display a div in the absolute center. i have a series of text links throughout my document that i am using to show the div, and the cotntent of the div is being controlled by which link they click on using ajax. i have a mild understanding of javascript i am just little slow on the event handle i guess. i looked on google and got some code and attempted something however i don't think it took any of the values since it still goes back to the top of the page when i click on a link near the bottom. if anyone has any suggestions or ideas or help with this i would appriciate it

     

    this is the javascript that i am using for the ajax

     

    var xmlHttp
    
    function show(str)
    { 
    xmlHttp=GetXmlHttpObject()
    if (xmlHttp==null)
    {
    alert ("Browser does not support HTTP Request")
    return
    } 
    var url="../inc/pop.php"
    url=url+"?img="+str
    url=url+"&action=show"
    url=url+"&sid="+Math.random()
    xmlHttp.onreadystatechange=stateChanged 
    xmlHttp.open("GET",url,true)
    xmlHttp.send(null)
    }
    
    function hide()
    { 
    xmlHttp=GetXmlHttpObject()
    if (xmlHttp==null)
    {
    alert ("Browser does not support HTTP Request")
    return
    } 
    var url="../inc/pop.php"
    url=url+"?action=hide"
    url=url+"&sid="+Math.random()
    xmlHttp.onreadystatechange=stateChanged 
    xmlHttp.open("GET",url,true)
    xmlHttp.send(null)
    }
    
    function stateChanged() 
    { 
    if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
    {
    if (window.innerWidth){
    var xpos = window.innerWidth/2;
    var ypos = (window.innerHeight/2)+window.pageYOffset;
    }
    if (document.all){
    var xpos =  document.body.clientWidth/2;
    var ypos =  (document.body.clientHeight/2)+document.body.scrollTop;
    }
    xpos = xpos - (document.getElementById("viewer").style.width/2);
    //xpos = xpos - (document.getElementById("viewer").style.width/2);
    document.getElementById("viewer").style.left=xpos+"px";
    document.getElementById("viewer").style.top=ypos+"px";
    document.getElementById("viewer").innerHTML=xmlHttp.responseText 
    } 
    }
    
    function GetXmlHttpObject()
    {
    var xmlHttp=null;
    try
    {
    // Firefox, Opera 8.0+, Safari
    xmlHttp=new XMLHttpRequest();
    }
    catch (e)
    {
    //Internet Explorer
    try
      {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
    catch (e)
      {
      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    }
    return xmlHttp;
    }
    

     

    this is the css of the div

     

    #viewer {
    position:absolute;
    left:400px;
    top:300px;
    z-index: 1000;
    width:371px;
    height:auto;
    }
    

  14. i am trying to write a script that displays a div relative to where yor mouse is located when you mouse over a link

     

    this is the code i put together

     

    <script type="text/javascript">
    
    	function getX(){
    	var xpos;
    	xpos=event.clientX;
    
    	return xpos;
    	}
    
    	function getY(){
    	var ypos;
    	ypos=event.clientY;
    
    	return ypos;
    	}
    
    	function show(pop_id){
    	var img,popup;
    	img="fig"+pop_id;
    	popup=document.getElementById(img);
    	popup.style.visability='visible';
    	popup.style.top=getX();
    	popup.style.left=getY();
    	}
    
    	function hide(pop_id){
    	var img,popup;
    	img="fig"+pop_id;
    	popup=document.getElementById(img);
    	popup.style.visability='hidden';
    	}
    
    	</script>
    

     

    this is the html i am using to call the script

     

    <a href="#" class="pop" onmouseover="show(1);" onmouseout="hide(1);">Figure 1</a>
    

     

    its been a while since i messed with javascript and i can't seem to get this to work i basically took the code directly from the w3schools example i fund while doing a search on the subject. Any help is appriciated.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.