njdubois

Yeah, I've been dealing with these email issues for years. Obviously it is WAY more complex than I had thought! This thread has answered some questions, and not that we already didn't know but we obviously need to get away from gocrappy! Thanks a lot!! Nick

Thanks mac_gyver for the site recommendation. I have sent the results to those in charge and will see what they say. Again, thanks fastsol for the help and recommendations as well. So far it has been radio silence from those I need a reply to. I think the 2 of them are on a plane. Fingers crossed I get this resolved. I'm not paid hourly after all =P Thanks so much! Nick

Thank you so much. You bring up interesting points that I am going to forward to those that are in charge! About emails/spam, just a second before your message, I got a reply to another forum post here about the email issue. You can see it here: http://forums.phpfreaks.com/topic/288965-in-need-of-a-miracle-some-emails-still-not-being-received/?do=findComment&comment=1481794 Fatsol puts forth, front and center how difficult emails to inbox can be! Thanks again for your reply, I hope it helps the bosses to really think about text messages. Nick

First, thank soooo much! That is the most detailed, and clearest explanation as to what is going on here. Thank you! We are looking into text messages, and you can see some questions I have regarding that in the general forum: http://forums.phpfreaks.com/topic/288968-ethics-question-pertaining-to-work-related-text-messages-to-non-work-related-devices/ I am going to forward this to my bosses as I think it will put front and center the complex nature of what we are doing. I personally had no idea there was so much to it! Thanks again!! Nick

Some of you may have seen one of my many posts about email issues. Some users don't get them, and I have determined it is probably because we are marked as spam. We are a service that grades sales team members on their phone skills. Listening to pre-recorded calls, grading and uploading them to our site, and then another part of our business looks them over and sometimes leaves a message that then get's forwarded to this persons work email. I have determined there is ways to get marked as spam as default by not having an opt out link. This is not an option, these sales members employer has opted in, and the emails are going to work related accounts hosted at that employer. Also, if one of these staff members is not so bright, or disgruntled they may mark us as spam anyways. The bottom line is that we have very little control over whether we are or are not marked as spam. So we want to start looking into sending text messages and this is where I start to question how good of an idea this is. First off, if it was me, and the messages where being sent to a device that my employer did not provide, I would in no way want work related text messages coming to me. Unless there is a vested interest in getting them. IE, I'm the boss at this place and am always on the clock. What if you are on the bottom? It's just a job for you. What if it is a pre-paid device, text messages cost money. What then? What if they don't even have, or want a cell phone? The short of it is this. If I'm at a job that is just another job, and this employer tells me that I have to get these messages. I'm going to look for another job. I see the organizations having continuous issues and complaints from their employees. Thus us as a business having issues keeping clients. What am I getting into here? What are your opinions on this matter? What are your recommendations as to alerting users of something on our site that we can rest assured are being received 100% of the time? Thanks! Nick

UPDATE. A more experienced programmer recommended opening a new gmail account and sending a message there. That message went right to the spam box. I am looking into ways of preventing that from happening without requiring the end user to make any changes. It would be difficult and time consuming to go through each user we currently have, and everytime we add a user from here on out. Any suggestions? Thanks Nick

Hello once again Php Freaks! I've probably posted this problem a few times a year for the past 5 or so years. I am a dev/admin for the site marcomtechnologies.com. From that website, using php we send emails out. Some users never get the email and it isn't in their spam folder. The two users we can confirm never get the email have @att.net email address and, let me warn you. Do not ever, EVER call att/yahoo/sbc for tech support. It's an endless circle and when you do finally talk to someone, they have a really hard time grasping that it is about emails coming from a server they are not hosting. I've talked to GoDaddy everytime, and everytime it is the same thing. Everything is ok on their end. I will post the code below. First what I have done. - The emails are coming "FROM" the correct domain. The website is marcomtechnologies.com, and the emails are from admin@marcomtechnologies.com. This was something that if not set this way, would be flagged as spam right off the top. this is a valid email, on the email services provided by godaddy. I can log in and send and receive emails from there no problem. - I was using the standard PHP mail command, than switched to PHPMailer and we still have the same problem. - I have checked to see if the domain is blacklisted. As far as I can tell it is not. If it was true, than my address, @gmail wouldn't get the emails and I do. (quick note, a few weeks ago even I didn't get some?) - GoDaddy tells me that we have 250 "relays" or emails that can go out. On a daily basis, we may send 50 messages. If that. - I have tried to get bounce back messages stating the message was undelivered and have yet to ever get one. - We have set up read receipts and they work, but not every sales person reads their emails, just kinda ignores them. So read receipts are not really helping us, cause we don't know if they are ignoring the message, or not getting them. - For one of our customers, we had to talk to an admin and have them put a rule on there server allowing messages from our domain. From what we can tell it worked, but again are the sales staff ignoring, or not getting the message? We don't know until we are there and they say so. Why is att.net not getting them? The emails are going out and leaving godaddy. Somewhere between godaddy and the receiver, the message is blocked, lost, deleted or just decides to take a day off. Which is really what seems to be happening. I've reach a state of utter frustration with this. Emails are a simple, all over the place, everyone uses, and has for a long long time technology. What can I do to confirm they got the message without them having to actually read it? What can I do to determine why the message isn't making it? I'm never getting those bounce backs, so I have no details at all. The clients we serve are not the most tech capable, and for all we know everything is ok. the problem is, for my boss, this is unacceptable. I need a solution, and a confirmation that the solution is working 110%. What am I missing? Here is the chuck of code that sends the messages out : require 'PHPMailer/PHPMailerAutoload.php'; require_once('PHPMailer/class.phpmailer.php'); $results_messages = array(); $mail = new PHPMailer(true); $mail->CharSet = 'utf-8'; class phpmailerAppException extends phpmailerException {} if($file_name[0]=='') { try { if(!PHPMailer::validateAddress($to)) { throw new phpmailerAppException("Email address " . $to . " is invalid -- aborting!"); } $body = $email_message; $body = eregi_replace("[\]",'',$body); $mail->AddReplyTo($_SESSION['member_email'],$_SESSION['WholeName']); $mail->SetFrom("admin@marcomtechnologies.com",$_SESSION['WholeName']); $mail->AddAddress($to,$to); $mail->Subject = $MSG_row['msg_subject']; $mail->MsgHTML($body); if(!$mail->Send()) { $results_messages[] = "Mailer Error: " . $mail->ErrorInfo; } else { $results_messages[] = "Message has been sent to " . $to . ', '; } } catch (phpmailerAppException $e) { $results_messages[] = $e->errorMessage(); } } else { $path = '../audio_upload/' . $audio_filename; $path_name=$audio_filename; try { if(!PHPMailer::validateAddress($to)) { throw new phpmailerAppException("Email address " . $to . " is invalid -- aborting!"); } $mail->isSendmail(); $mail->addReplyTo($_SESSION['member_email'], $_SESSION['WholeName']); $mail->SetFrom("admin@marcomtechnologies.com",$_SESSION['WholeName']); $mail->addAddress($to, $to); $mail->Subject = $MSG_row['msg_subject']; //$body = "<<<'EOT'"; $body = $email_message; //$body .= "EOT"; $mail->WordWrap = 80; $mail->msgHTML($body, dirname(__FILE__), true); //Create message bodies and embed images // preparing attachments $main_path='email_upload/'; for($x=0;$x<count($file_name);$x++){ $mail->addAttachment($main_path.$file_name[$x]); // optional name } try { $mail->send(); $results_messages[] = "Message has been sent to " . $to . ', '; } catch (phpmailerException $e) { throw new phpmailerAppException('Unable to send to: ' . $to. ': '.$e->getMessage()); } } catch (phpmailerAppException $e) { $results_messages[] = $e->errorMessage(); } } $mail->clearAddresses(); $mail->clearAttachments(); The above is just the part that sends the email, it is part of an AJAX file, and you can download a ZIP with the whole file here: http://marcomtechnologies.com/email_code.zip I have removed the database usernames/password stuff. You will see what I mean, other than that it is 100% complete. I have absolutely no idea what to do. I'm in the dark blindfolded. Thank you so much for taking the time to review my problem! Nick

I thought that was the cause, but was puzzled because it only happened .01% of the time. I have already changed that. Thanks for your time! Nick

Sure, <br /> This alert is to inform you that a Final Critique was posted to the call with these details:<br /> <a href="someurl.com/view.php?file='.$call_id.'">'.$brief_call_details.'(Click here to see this call)</a> <br /><br /> Thanks for looking! Nick

Sorry for the confusion! On my site, I have an email function that sends an email alerting the user to a change. The godaddy part was unrelated, ignore it. From my code, I am sending the link: someurl.com/view.php?file=123 but the user gets : http://www.someurl.com/someurl.com/view.php?file=123 Is this happening because I don't have the full "http://www" ? or is there something else causing this? Thanks

Odd one for you! I am sending emails out with some text and a link to : someurl.com/view.php?blah=blip Been using the same code for a while, and outside of emails actually being sent (which ended up being godaddy, not my code!) the link has worked 100%. Until today! I got forwarded an email back. The link was pointing to an error page. File not found! Huh? Looked at the link and it is now : http://www.someurl.com/someurl.com/view.php?blah=blip I do send out CC to myself and other admins, our links were fine? For good measure I'm going to complete the whole url, probably should have in the first place. What is stopping this from becoming : http://www.someurl.com/http://www.someurl.com/view?blah=blip Is there something else I can be doing to stop that from ever happening again? Thanks Nick

Solved with vertical-align:top; Can someone explain why? It's really confusing! Thanks Nick

if you go to http://musicwhynot.com/beacon/test.html You will see that the 3 squares do not line up vertically. I know that the extra longer length of text inside the 3rd div is the cause, I just don't know why. Below is the code, why doesn't the text take up the empty space correctly? <div id="Item_Output_Container" style="width:1670px;background-color:white;margin-top:25px;"> <div style="border-style:solid;border-width:5px;display:inline-block;width:150px;height:150px;max-width:150px;max-height:150px;padding:10px;font-size:10px;"> 4-20 X 1 PHILLIPS PAN HEAD 48-2 TRILOBE THREAD FORMING SCREW CASE HARDENED STEEL TRIVALENT ZINC, BAKE & WAX ROHS COMPLIANT </div> <div style="border-style:solid;border-width:5px;display:inline-block;width:150px;height:150px;max-width:150px;max-height:150px;padding:10px;font-size:10px;"> 6-19 X 1 PHILLIPS PAN HEAD 48-2 TRILOBE THREAD FORMING SCREW CASE HARDENED STEEL TRIVALENT ZINC, BAKE & WAX ROHS COMPLIANT </div> <div style="border-style:solid;border-width:5px;display:inline-block;width:150px;height:150px;max-width:150px;max-height:150px;padding:10px;font-size:10px;"> 6-19 X 1 UNSLOTTED INDENTED HEX WASHER HEAD 48-2 TRILOBE THREAD FORMING SCREW CASE HARDENED STEEL TRIVALENT ZINC, BAKE & WAX ROHS COMPLIANT </div> </div> I cannot figure this out, and it's driving me CRAZY!!! I can remove any section of the longer text in the third box and it lines up. First 4 words, middle 4 words, last 4 words, either way, that fixes the problem. Thanks a million, Nick

I know for a fact that my database is way...WAY far from perfect. I learn as I go, a major overhaul based on all the things I have learned over the past few years is planned. That is exactly one of those things I want to do. Just.... ha, when.. who knows. This project is the kind of project that is never done. Always changing. Changing over the auto database would be easy. I don't understand what you mean by foreign key though? Also, would splitting the auto table, into 3 tables increase the speed by a noticed factor?? Thanks Nick

Anywhere else I use the auto database, that is exactly how I do it. Send the selected Make over ajax... fill the model select....send the model over...fill the trim. The user has to, absolutely must be able to pick either a make or a model. It is the only way this project is going to work. It has to be simple, simple simple.

I don't know what they will pick first. Make or Model, though I'm sure I could ignore trim. The actual use of it has to be as simple and pain free as possible. I can't say, do you have either a make or model? I can't assume they are going to always get the make first. How else should I do it? I can't just have a textbox, cause I have to assume my target user can't spell. I understand that populating the dropdown with so much is what's causing it to take so long. I need a faster way to present the user with the full list of Make, and the full list of Model. thanks! Nick [edit]The customer may say I have a "Contour SVT" and the user may not know that a Contour is a Ford.[/edit]

I have the following code, and it takes FOREVER. How could I speed it up? $Car_Info_All_SQL="SELECT DISTINCT make FROM car_make ORDER BY make ASC"; $Car_Info_All_results=mysql_query($Car_Info_All_SQL); $make_html = '<select id="make" name="make" onchange="update_auto_dropdowns(this.id);" onfocus="" onblur="" style="font-size:10px;"><option value="">select make ...</option>'; while ($row = mysql_fetch_array($Car_Info_All_results)) { if($row['make']!='') { if ( strtoupper($row['make']) == $_GET['make'] ) { $make_html.='<option value="'.strtoupper($row['make']).'" SELECTED>'.strtoupper($row['make']).'</option>'; } else { $make_html.='<option value="'.strtoupper($row['make']).'">'.strtoupper($row['make']).'</option>'; } } } $make_html.='</select>'; $Car_Info_All_SQL="SELECT DISTINCT model FROM car_make ORDER BY model ASC"; $Car_Info_All_results=mysql_query($Car_Info_All_SQL); $model_html = '<select id="model" name="model" onchange="update_auto_dropdowns(this.id);" onfocus="" onblur="" style="font-size:10px;"><option value="">select model ...</option>'; while ($row = mysql_fetch_array($Car_Info_All_results)) { if($row['model']!='') { if ( strtoupper($row['model']) == $_GET['model'] ) { $model_html.='<option value="'.strtoupper($row['model']).'" SELECTED>'.strtoupper($row['model']).'</option>'; } else { $model_html.='<option value="'.strtoupper($row['model']).'">'.strtoupper($row['model']).'</option>'; } } } $model_html.='</select>'; $Car_Info_All_SQL="SELECT DISTINCT trim FROM car_make ORDER BY trim ASC"; $Car_Info_All_results=mysql_query($Car_Info_All_SQL); $trim_html = '<select id="trim" name="trim" onchange="update_auto_dropdowns(this.id);" onfocus="" onblur="" style="font-size:10px;"><option value="">select trim ...</option>'; while ($row = mysql_fetch_array($Car_Info_All_results)) { if($row['trim']!='') { if ( strtoupper($row['trim']) == $_GET['time'] ) { $trim_html.='<option value="'.strtoupper($row['trimel']).'" SELECTED>'.strtoupper($row['trim']).'</option>'; } else { $trim_html.='<option value="'.strtoupper($row['trimel']).'">'.strtoupper($row['trim']).'</option>'; } } } $trim_html.='</select>'; Thanks Nick

I know I know..pie charts... all over the internet... use this plug in, use that library... Well, I'm trying to create an info graphic kind of pie chart, so it needs to be done a certain way. Imagine a pie chart with only 2 data values. Those that like the color red = 75% Those that like the color white = 25% You can image what the pie chart would look like, 3/4th's of the circle will be red, and a quarter of it white. I want to create pie charts like that. Only change the "radius" distance. In the above example, the red will be a transparency key. and the white will be a solid color. Meaning that when I am done creating the image that is the pie chart, half will be transparent, the other a solid color so I can see whats under the transparent part and do some neat layering. I need to be able to output this pie chart as an image to an HTML element. It doesn't need to be saved anywhere, just be inserted into this element, though it may end up being inserted into a pdf file. So, I need to know how to create 2 lines, both coming from a center point X and Y, each going a radius as Z distance away from the center point. and then I need to connect those 2 lines with an arc, and fill it with a color. My question is, what is the best way to handle this? is there a better way to do it using PHP? Javascript? maybe even HTML5 ? Remember, that I need to be able to make a color transparent, easily. While I don't have the math now, I did it 15 years ago in middle school....soooo I'm sure I'll figure that out! =D Thanks so much in advanced! Nick

nogray, I really can't say it enough. Thank you. I spent the whole week on this, posted in a few places and you are the only one to reply. Not only are you the only one to reply, but you provided such great answers. Some would argue you gave me to much info! It worked of course. I really appreciate it. I am trying to model off another sites slider for a friends page. It did not have the ticks, but I can see how to change up the existing code to add one if they change their mind. All the available content sliders seemed so bulking and I didn't know what I was getting into when I tried to write me own. At least now I have a basic understanding of moving stuff around in a pretty way. Should come in handy later huh! Thanks again!!!

I am honestly not use to getting such whole examples of code. Thank you! It really shows that there is quite a few ways of doing this. Using your latest code example, I was able to get even closer to what I am looking for. It now works the same in every browser. I was able to add the animation and logic to move the slides the other way. But the first time I switch directions, I get this bounce back. Then each slide in that same direction works ok. I know it has something to do with the current class for each slide, and you will notice that i for loop through all slides setting them to the right class. This seems to work...after the first click switching directions. I know I have to apply a certain class to a certain slide, but am not sure what or where? Again, thanks for your help, A few days ago all this animation/transition stuff seemed so confusing! Here is the updated version of your code. I had to take the function that moved to a cell, and apply it to each direction function instead. This way I could set and play with current and the "next" slide before any numbers changed. You can see it live here : http://musicwhynot.com/slide_3.php <!doctype html> <html> <head> <meta charset="utf-8"> <title>Content Slider Example</title> </head> <body> <style> .slider_holder { position:relative; width:500px; height:500px; border:solid #000000 1px; margin:auto; overflow:hidden; } .slide { position:absolute; top:0px; left:0px; width:100%; height:100%; opacity: 1; text-align:center; -webkit-transition:left 1s, opacity 1s; -moz-transition:left 1s, opacity 1s; transition:left 1s, opacity 1s; -webkit-transition-timing-function:ease; -moz-transition-timing-function:ease; transition-timing-function:ease; } .slide.hidden_to_left { left:-100%; opacity:0; } .slide.hidden_to_right { left:100%; opacity:0; } .slide.next { left:100%; right:auto; opacity:0; -webkit-transition-duration:0s; -moz-transition-duration:0s; transition-duration:0s; } .slide.last { left:-100%; right:auto; opacity:0; -webkit-transition-duration:0s; -moz-transition-duration:0s; transition-duration:0s; } </style> <div class="slider_holder" id="my_slides"> <div class="slide">Slide 1</div> <div class="slide last">Slide 2</div> <div class="slide last">Slide 3</div> <div class="slide last">Slide 4</div> <div class="slide last">Slide 5</div> <div class="slide last">Slide 6</div> </div> <button onclick="previous();">Previous</button> <button onclick="next();">Next</button> <script type="text/javascript"> // current slide var current_slide = 1; // checking if we need to add the event var did_add_evt = false; // making sure the transition doesn overlap var is_transition = false; function previous(){ // slides var slides = document.getElementById('my_slides').querySelectorAll('.slide'); // if the transition is running, return if (is_transition) return; num = current_slide - 1; for (var i=0;i<=slides.length -1;i++) { slides[i].className = 'slide last'; } slides[current_slide - 1].className = 'slide'; // making sure the number is not larger than the slides if (num > slides.length) num = 1; // making sure the slides are not smaller than zero if (num < 1) num = slides.length; is_transition = true; // adding the event if (!did_add_evt){ var end_func = function(){ if (this.className.indexOf('hidden') != -1) this.className = 'slide last'; is_transition = false }; for (var i=0; i<slides.length; i++){ slides[i].addEventListener('transitionend', end_func, false); slides[i].addEventListener('transitionEnd', end_func, false); slides[i].addEventListener('webkitTransitionEnd', end_func, false); slides[i].addEventListener('oTransitionEnd', end_func, false); } } slides[current_slide - 1].className = 'slide hidden_to_right'; current_slide = num; slides[current_slide - 1].className = 'slide' } function next(){ // slides var slides = document.getElementById('my_slides').querySelectorAll('.slide'); // if the transition is running, return if (is_transition) return; num = current_slide + 1; for (var i=0;i<=slides.length -1;i++) { slides[i].className = 'slide next'; } slides[current_slide - 1].className = 'slide'; // making sure the number is not larger than the slides if (num > slides.length) num = 1; // making sure the slides are not smaller than zero if (num < 1) num = slides.length; is_transition = true; // adding the event if (!did_add_evt){ var end_func = function(){ if (this.className.indexOf('hidden') != -1) this.className = 'slide next'; is_transition = false }; for (var i=0; i<slides.length; i++){ slides[i].addEventListener('transitionend', end_func, false); slides[i].addEventListener('transitionEnd', end_func, false); slides[i].addEventListener('webkitTransitionEnd', end_func, false); slides[i].addEventListener('oTransitionEnd', end_func, false); } } slides[current_slide - 1].className = 'slide hidden_to_left'; current_slide = num; slides[current_slide - 1].className = 'slide' } </script> </body> </html>

FYI, the code for slide.php : <?php $slide_width=800; ?> <!DOCTYPE html> <html> <head> <style> .sliding_div { width:<?php echo $slide_width; ?>px; position:relative; animation-name: right-to-left; animation-duration: 1s; animation-timing-function: ease; animation-delay: 0s; animation-iteration-count: 1; animation-play-state:paused; backface-visibility: hidden; -moz-animation-name: right-to-left; -moz-animation-duration: 1s; -moz-animation-timing-function: ease; -moz-animation-delay: 0s; -moz-animation-iteration-count: 1; -moz-animation-play-state:paused; -moz-backface-visibility: hidden; -webkit-animation-name: right-to-left; -webkit-animation-duration: 1s; -webkit-animation-timing-function: ease; -webkit-animation-delay: 0s; -webkit-animation-iteration-count: 1; -webkit-animation-play-state:paused; -webkit-backface-visibility: hidden; } @keyframes right-to-left { from {left:0px;} to {left:-<?php echo $slide_width; ?>px;} } @-webkit-keyframes right-to-left { from {left:0px;} to {left:-<?php echo $slide_width; ?>px;} } @-moz-keyframes right-to-left { from {left:0px;} to {left:-<?php echo $slide_width; ?>px;} } @keyframes left-to-right { from {left:0px;} to {left:<?php echo $slide_width; ?>px;} } @-webkit-keyframes left-to-right { from {left:0px;} to {left:<?php echo $slide_width; ?>px;} } @-moz-keyframes left-to-right { from {left:0px;} to {left:<?php echo $slide_width; ?>px;} } </style> <script language="javascript" type="text/javascript"> var num_slides=3; // INCLUDES 0! var cur_slide=0; var last_slide; var next_slide; var in_motion=0; var slide_width = <?php echo $slide_width; ?>; function do_load() { change_slide(0) }; function change_slide(new_slide_num) { cur_slide = new_slide_num; if ( cur_slide < 0 ) { cur_slide=num_slides; } if ( cur_slide > num_slides ) { cur_slide = 0; } last_slide = cur_slide - 1; if ( last_slide < 0 ) { last_slide=num_slides; } next_slide = cur_slide + 1; if ( next_slide > num_slides ) { next_slide = 0; } document.getElementById("output").innerHTML = "cur_slide = " + cur_slide + ", num_slides = " + num_slides + ", next_slide = " + next_slide + ", last_slide = " + last_slide; }; function move_next_slide() { if (in_motion==0) { document.getElementById("div" + next_slide).style.display="inline-block"; document.getElementById("div" + next_slide).style.left = (slide_width + "px"); cur_slide++; change_slide(cur_slide); in_motion=1; document.getElementById("my-div").classList.remove("sliding_div"); document.getElementById("my-div").offsetWidth = document.getElementById("my-div").offsetWidth; document.getElementById("my-div").classList.add("sliding_div"); document.getElementById("my-div").style.animationName="right-to-left"; document.getElementById("my-div").style.webkitAnimationName="right-to-left"; document.getElementById("my-div").style.mozAnimationName="right-to-left"; document.getElementById("my-div").style.animationPlayState="running"; document.getElementById("my-div").style.webkitAnimationPlayState="running"; document.getElementById("my-div").style.mozAnimationPlayState="running"; setTimeout("move_done()", 990); } }; function move_last_slide() { if (in_motion==0) { document.getElementById("div" + last_slide).style.display="inline-block"; document.getElementById("div" + last_slide).style.left = "-" + slide_width + "px"; cur_slide--; change_slide(cur_slide); in_motion=1; document.getElementById("my-div").classList.remove("sliding_div"); document.getElementById("my-div").offsetWidth = document.getElementById("my-div").offsetWidth; document.getElementById("my-div").classList.add("sliding_div"); document.getElementById("my-div").style.animationName="left-to-right"; document.getElementById("my-div").style.webkitAnimationName="left-to-right"; document.getElementById("my-div").style.mozAnimationName="left-to-right"; document.getElementById("my-div").style.animationPlayState="running"; document.getElementById("my-div").style.webkitAnimationPlayState="running"; document.getElementById("my-div").style.mozAnimationPlayState="running"; setTimeout("move_done()", 1000); } }; function move_done() { for (var i=0;i<=num_slides;i++) { document.getElementById("div" + i).style.display="none"; } document.getElementById("div" + cur_slide).style.display="inline-block"; document.getElementById("div" + cur_slide).style.left = "0px"; in_motion="0"; }; </script> </head> <body style="background-color:grey;" onload="do_load();"> <center> <br /> <input type="button" onclick="move_last_slide();" value="<-" /> <input type="button" onclick="move_next_slide();" value="->" /><br /> <span id="output"></span> <br /><br /> <div style="overflow:hidden;width:<?php echo $slide_width; ?>px;height:400px;background-color:white;"> <div class="sliding_div" id="my-div"> <div id="div0" style="width:<?php echo $slide_width; ?>px;height:400px;position:absolute;top:0px;left:0px;display:inline-block;"> <table width="100%" height="100%" border="1"><tr><td align="center" valign="middle">0</td></tr></table> </div> <div id="div1" style="width:<?php echo $slide_width; ?>px;height:400px;position:absolute;top:0px;left:0px;display:none;"> <table width="100%" height="100%" border="1"><tr><td align="center" valign="middle">1</td></tr></table> </div> <div id="div2" style="width:<?php echo $slide_width; ?>px;height:400px;position:absolute;top:0px;left:0px;display:none;"> <table width="100%" height="100%" border="1"><tr><td align="center" valign="middle">2</td></tr></table> </div> <div id="div3" style="width:<?php echo $slide_width; ?>px;height:400px;position:absolute;top:0px;left:0px;display:none;"> <table width="100%" height="100%" border="1"><tr><td align="center" valign="middle">3</td></tr></table> </div> </div> </div> </center> </body> </html>

First, Thank you so much! While I have come close to my desired effect with my OP source. I want to be doing things correctly, and that means using either, or. Not both. Using my OP source, I was able to get exactly what I was looking for, but it only worked right in Chrome. You can see it here : http://musicwhynot.com/slide.php Using your modified version of my code, I did the same thing, only using your code in the right place and now I have this : http://musicwhynot.com/slide_2.php The second example, "works" in Chrome, Firefox and IE. Which is GREAT, but it is still doing something funky. The first time you move the slides, left or right, it works correctly. The next time you click that exact direction, it doesn't show the transition. Using a recommendation I read about on another site, I use a timeout because sometimes the event is fired. Say you click Left, and then Right. It's like it is doubling the distance it has to move? So you see the current slide move out of the way, about a whole slides length, and then you see the next slide move into place. I read on another site, you need to classlist.remove and classlist.add to get the animation to run again, using this chunk of code : document.getElementById("my-div").classList.remove("sliding_div"); document.getElementById("my-div").offsetWidth = document.getElementById("my-div").offsetWidth; document.getElementById("my-div").classList.add("sliding_div"); I've tried "sliding_div sliding_div-left-to-right" and "sliding_div-left-to-right" But this has no effect on anything anymore, which I guess is because that's for animations, not transitions. Here is slide_2.php. Sorry that it is a little more complex than my OP. I hope that is ok. <?php $slide_width=800; ?> <!DOCTYPE html> <html> <head> <style> .sliding_div { width:<?php echo $slide_width; ?>px; position:relative; left:0px; transition:left 1s; transition-timing-function:ease; } .sliding_div-left-to-right {left:-<?php echo $slide_width; ?>px;} .sliding_div-right-to-left {left:<?php echo $slide_width; ?>px;} </style> </head> <body style="background-color:grey;" onload="do_load();"> <center> <br /> <input type="button" onclick="move_last_slide();" value="<-" /> <input type="button" onclick="move_next_slide();" value="->" /><br /> <span id="output"></span> <br /><br /> <div style="overflow:hidden;width:<?php echo $slide_width; ?>px;height:400px;background-color:white;"> <div class="sliding_div" id="my-div"> <div id="div0" style="width:<?php echo $slide_width; ?>px;height:400px;position:absolute;top:0px;left:0px;display:inline-block;"> <table width="100%" height="100%" border="1"><tr><td align="center" valign="middle">0</td></tr></table> </div> <div id="div1" style="width:<?php echo $slide_width; ?>px;height:400px;position:absolute;top:0px;left:0px;display:none;"> <table width="100%" height="100%" border="1"><tr><td align="center" valign="middle">1</td></tr></table> </div> <div id="div2" style="width:<?php echo $slide_width; ?>px;height:400px;position:absolute;top:0px;left:0px;display:none;"> <table width="100%" height="100%" border="1"><tr><td align="center" valign="middle">2</td></tr></table> </div> <div id="div3" style="width:<?php echo $slide_width; ?>px;height:400px;position:absolute;top:0px;left:0px;display:none;"> <table width="100%" height="100%" border="1"><tr><td align="center" valign="middle">3</td></tr></table> </div> </div> </div> </center> <script language="javascript" type="text/javascript"> var num_slides=3; // INCLUDES 0! var cur_slide=0; var last_slide; var next_slide; var in_motion=0; var slide_width = <?php echo $slide_width; ?>; document.getElementById("my-div").addEventListener( 'transitionend', end_transition, false ); document.getElementById("my-div").addEventListener( 'transitionEnd', end_transition, false ); document.getElementById("my-div").addEventListener( 'webkitTransitionEnd', end_transition, false ); document.getElementById("my-div").addEventListener( 'oTransitionEnd', end_transition, false ); function do_load() { // Set Variables change_slide(0) }; function change_slide(new_slide_num) { // new_slide_num will equal cur_slide +1 or cur_slide -1 cur_slide = new_slide_num; if ( cur_slide < 0 ) { cur_slide=num_slides; } if ( cur_slide > num_slides ) { cur_slide = 0; } last_slide = cur_slide - 1; if ( last_slide < 0 ) { last_slide=num_slides; } next_slide = cur_slide + 1; if ( next_slide > num_slides ) { next_slide = 0; } document.getElementById("output").innerHTML = "cur_slide = " + cur_slide + ", num_slides = " + num_slides + ", next_slide = " + next_slide + ", last_slide = " + last_slide; }; function move_next_slide() { if (in_motion==0) { document.getElementById("div" + next_slide).style.display="inline-block"; document.getElementById("div" + next_slide).style.left = (slide_width + "px"); cur_slide++; change_slide(cur_slide); in_motion=1; document.getElementById("my-div").className = 'sliding_div sliding_div-left-to-right'; setTimeout("end_transition()", 1000); } }; function move_last_slide() { if (in_motion==0) { document.getElementById("div" + last_slide).style.display="inline-block"; document.getElementById("div" + last_slide).style.left = "-" + slide_width + "px"; cur_slide--; change_slide(cur_slide); in_motion=1; document.getElementById("my-div").className = 'sliding_div sliding_div-right-to-left'; setTimeout("end_transition()", 1000); } }; function end_transition(evt){ if (in_motion==1) { for (var i=0;i<=num_slides;i++) { document.getElementById("div" + i).style.display="none"; } document.getElementById("div" + cur_slide).style.display="inline-block"; in_motion=0; } }; </script> </body> </html> What am I missing to get this to "restart?" Thanks for the help in the first place. Really! Much appreciated. If you havn't figured it out yet, I'm trying to create my own simple content slider. Nick

In Internet explorer, the animation plays, resets and then nothing. <!DOCTYPE html> <html> <head> <style> .mydiv { width:200px; position:relative; animation-name: right-to-left; animation-duration: 1s; animation-timing-function: ease; animation-delay: 0s; animation-iteration-count: 1; animation-play-state:paused; } @keyframes right-to-left { from {left:0px;} to {left:-200px;} } @-webkit-keyframes right-to-left { from {left:0px;} to {left:-200px;} } </style> <script language="javascript" type="text/javascript"> function start_slide() { document.getElementById("my-div").style.animationPlayState="running"; document.getElementById("my-div").addEventListener( 'transitionend', function( event ) { alert( "Finished transition!" ); }, false ); document.getElementById("my-div").addEventListener( 'transitionEnd', function( event ) { alert( "Finished transition!" ); }, false ); document.getElementById("my-div").addEventListener( 'webkitTransitionEnd', function( event ) { alert( "Finished transition!" ); }, false ); document.getElementById("my-div").addEventListener( 'oTransitionEnd', function( event ) { alert( "Finished transition!" ); }, false ); } </script> </head> <body> <center> <div class="mydiv" id="my-div"> <div style="display:inline-block;width:200px;height:200px;background-color:red;">1</div> <div style="display:inline-block;width:200px;height:200px;background-color:green;position:absolute;top:0px;left:200px;">2</div> </div> <input type="button" onclick="start_slide();" value="go" /> </center> </body> </html> I'm so confused, per everything I'm reading, this should work? I know how to restart the animation, but I would RREEAALLLYYY like to know why I'm not getting a little pop up saying it's done. What am I missing? Thanks Nick

Creating proper indexes is something I've seen mentioned a few times now. What does this term mean? I have an auto incrementing ID field that is unique per each record, is that what indexing is? Most of my field data types are "text" and all ID fields are long int. So, per your last post, and all other posts so far. I need to look at: My loops, and how they handle pulling data. Pulling data in general. My field Data types. indexing my databases. and setting up a service like XDebug Profiler. Keep the advice coming! Thank you so much! Nick

@mac_gyver : Some of the stuff you mentioned was mentioned in the link I posted last. Though I think you went into more detail. Yes, There is all of the above. One page in question is a calendar form. I do the work to draw a month. The last days of the previous month and the first days of the next month and all. For each day, I pull data. How many sales calls, total incoming calls, total appointments set and after hour calls are displayed on each "day" per each client. I don't pull each day, I pull the range from the earliest day shown for the last month, to the last day displayed of the next month, if there is any. I think its 5 "weeks" and the first and last week sometimes have days of the last and next month. I then loop through the days and put the correct data where it needs to go. This is one big ajax request, and AJAX returns the whole calendar HTML formatted and all. You can click on a day and a listbox gets populated with the days calls in a little more detail. Yet another AJAX/Mysql call. I had thought that using ajax is all around a better way of doing things. Instead of loading a whole page with every submit, I'm just loading a part. So I have applied it all over the place. I learned javascript so I could use AJAX. I may have been using javascript for a year now. Maybe! I do have many many loops, both whiles and foreach. All over the project. Everywhere. This is exactly why I would like to have someone a few levels higher than me on the programming ladder to critique my code. I am sure there is a billion ways to improve it and I am all about self improvement. These loops maybe 1 of many things I could do better. I'm not afraid of doing the work, I just need to know what to do. If someone said Nick, do this instead, I would go through my code and replace what needed to be replaced. I wish I went to college. I was leaving high school acing an AP Computer Science class. I aced it without trying. Unfortantatly I screwed my credit up....with student loans..... so it isn't an option right now. On top of that, I need solutions, I don't have the option to put this project on hold while I take 4 years of college. I think my best and only choice is to cough up what little cash I have to pay someone to audit my code. Keep the suggestions coming! As always I'm never pointed in a wrong direction by posting here! Thanks Nick