 |
|
|
| View previous topic :: View next topic |
| Author |
Message |
skendall
Joined: 25 Aug 2008 Posts: 5
|
Posted: Mon Aug 25, 2008 7:59 am Problem with <div> tag and Internet Explorer |
|
|
|
Our company is working to create a survey using Instant Survey (www.instantsurvey.com), which has a template for creating your questions and possible answers, but we would also like to include our own flash videos to play along-side the questions.
We have been able to achieve this effect using the code below which embeds the .swf and then moves it up and to the right so that it is beside the questions. The only problem is that using Internet Explorer adds a 350 pixel gap where our code is placed (the height of the video), which pushes the "Next" button at the bottom of the page down 350 pixels. Using Firefox drastically reduces this problem only adding about 50 pixels of space where the code is located. Is there a way to achieve the same result we have, but without the spacing problem we are having with Internet Explorer?
Unfortunately, due to the way the template is layed-out we can't put the code below the "next" button. It has to come before it. If we put the code anywhere else in the questions it will put the same gap, so the bottom is the best place, but we need to eliminate the huge gap.
Here is the code we are using:
| Code: |
| <DIV id="video" style="POSITION: relative; TOP:-500; left:650; width:0; height:0; BACKGROUND-COLOR: #01B128; layer-background-color: #01B128"><object width="1" height="1"><embed src="http://www.kipphoto.com/Vguide01.swf" type="application/x-shockwave-flash" allowfullscreen="false" width="200" height="350"></embed></object></DIV> |
Thanks |
|
sticks464
Joined: 31 Dec 2006 Posts: 1173
|
Posted: Mon Aug 25, 2008 11:51 am |
|
|
|
| Not enough code, give the whole page code and css or a live link. |
|
skendall
Joined: 25 Aug 2008 Posts: 5
|
Posted: Tue Aug 26, 2008 4:44 am |
|
|
|
Ok, here is the link to the page. Like I said before, we are restricted by the template the survey company provides so our code must go inside a question. We can add script to the page and we're able to add any html code, but we're restricted on where it is located on the page.
http://is-nri.com/take/?i=137009&r=28182312&h=6ckx6UWnWaNU_71r41T4lw
Thanks |
|
sticks464
Joined: 31 Dec 2006 Posts: 1173
|
Posted: Tue Aug 26, 2008 6:02 am |
|
|
|
This will put the video between the header (SURVEY) and the first question in the dark green area and centered.
| Code: |
<table border="0" cellpadding="10" width="100%" cellspacing="0">
<tr>
<td align="center"><span name="p" align="left"><font size="7" face="Verdana, Arial, Helvetica, sans-serif" color="Khaki"><b>Survey</b></font></span></td>
</tr>
<tr>
<td>
<DIV id="video" style="POSITION: relative; width:200px; height:350px; BACKGROUND-COLOR: #01B128; layer-background-color: #01B128; margin:0 auto;"><object width="1" height="1"><embed src="http://www.kipphoto.com/Vguide01.swf" type="application/x-shockwave-flash" allowfullscreen="false" width="200" height="350"></embed></object></DIV>
</td>
</tr>
</table> |
|
|
skendall
Joined: 25 Aug 2008 Posts: 5
|
Posted: Tue Aug 26, 2008 7:19 am |
|
|
|
I appreciate the suggestion, but unfortunately that won't work. I'm not allowed enough space to put in the code where the header is located. They only allow you 64 characters. Also, the way they have the template set up, the header is the same for every page and thus we couldn't use a separate video for each page if we put the code there.
Not only that, but we want to keep the videos out to the side of the questions, not right in the middle and above them.
If you know of a way I could achieve this let me know.
Oh, one more thing. Make sure you don't finish the survey, otherwise it won't let you back in.
Thanks |
|
sticks464
Joined: 31 Dec 2006 Posts: 1173
|
Posted: Tue Aug 26, 2008 8:32 am |
|
|
|
Unfortunately what you want will not work if a users resolution is 800X600, anything outside the survey box will be off the screen. Check your current form in different resolutions to see what is happening. An alternative would be to make the flash movie with a transparent background and use absolute positioning to put it over the right side of the survey form so it doesn't cover the radio buttons that need to be checked.. That would take it out of the normal flow and would stay in the same location on each page.
If I understand this correctly, only the survey form gets refreshed on submit. If this is true the movie will not change unless it is written into the javascript to do so. However if a new page loads each time then a different movie can be included as you are trying to do. It can also go just above the submit button
| Code: |
</table><INPUT type="hidden" name="SurveyId" ><input type="hidden" name="r" value='28182312' ><input type="hidden" name="h" value='6ckx6UWnWaNU_71r41T4lw' ><input type="hidden" name="instanceid" value='137009' ><input type="hidden" name="redirurl" value='' ><input type="hidden" name="questionn" value="" ><input type="hidden" name="categoryn" value="" ><input type="hidden" name="prevquestionn" value="" ><input type="hidden" name="prevcategoryn" value="" ><INPUT type="hidden" name="PageID" value="1"><table cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td>
<DIV id="video" style="POSITION: relative; width:200px; height:350px; BACKGROUND-COLOR: #01B128; layer-background-color: #01B128; margin:0 auto;"><object width="1" height="1"><embed src="http://www.kipphoto.com/Vguide01.swf" type="application/x-shockwave-flash" allowfullscreen="false" width="200" height="350"></embed></object></DIV>
</td>
</tr>
<tr>
<td><br><br><hr>
<center><INPUT value="Next" style="font-weight: bold;font-family:Arial, Helvetica, Sans-serif;" alt="submit form" type="submit"><br><br></center> |
|
|
skendall
Joined: 25 Aug 2008 Posts: 5
|
Posted: Tue Aug 26, 2008 10:34 am |
|
|
|
The width of the survey is 640px, so we may need to make it a little thinner. I haven't addressed this yet because I was working on just getting the video to work the way we wanted first, but that is something I can easily change.
We actually started out using an "absolute" position, but changed to relative because if someone resized the browser window the video would stay in the same spot, sometimes covering up question and buttons, etc.
I suppose we could go back to this method if no other solution is possible, but it was much better having the video scroll and reposition with the window.
As far as the scripting goes, I was using some script to begin with (when I was using an absolute position), but didn't find it necessary after switching to a relative position. I'm not extremely savvy with the scripting, mostly gathering what I needed from other sources online and piecing it together, but I'll post you what I was using initially. I have the option in the survey template to include script that loads when the page loads.
| Code: |
var bbla = document.getElementById("video");
bbla.style.left = "50%"
var bblaleft = bbla.offsetLeft
bbla.style.left = bblaleft + 350 |
|
|
skendall
Joined: 25 Aug 2008 Posts: 5
|
Posted: Tue Sep 02, 2008 11:57 am |
|
|
|
| Still no solution to this problem. |
|
|
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum
|
|
|
|
|