|
I have a link showing my issue, link below. In the background firefox looks to be adding extra space to the bottom of my banner nav buttons and also to the div block above it. http://postimage.org/image/krt95j1wj/
I have tried the following with no effect, or an undesired effect;
...font-size: 0 in the ul and font-size:normal on the li
...display inline
...add divs to the text inside the inside of the li tags
here is the html. any ideas...?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style>
*{
margin:0;
padding:0;
border:0;
}
#banner_container{
width:770px;
height:360px;
overflow:auto;
}
#banner{
position:absolute;
list-style-type:none;
width:770px;
height:360px;
overflow:hidden;
clip:rect(0px,770px,360px,0px);
}
#banner li{
width:770px;
height:360px;
position:absolute;
top:0;
left:0;
}
.right_side_container{
float:right;
clear:left;
width:250px;
height:360px;
}
.ad_box{
height:160px;
width:230px;
margin:10px;
background:white;
}
.main_banner_text{
position:relative;
background:url('bg_white_fade.png');
color:black;
height:60px;
width:400px;
top:240px;
padding:10px;
}
#banner_nav{
list-style-type:none;
margin:0;
padding:0;
border:0;
position:absolute;
top:325px;
left:10px;
width:300px;
height:25px;
}
#banner_nav li{
float:left;
clear:right;
width:25px;
height:25px;
border:0;
margin-left:3px;
padding:5px;
font-size:10pt;
text-align:center;
background:url('bg_black_fade.png');
color:white;
}
.banner_nav_current{
background:url('bg_white_fade.png') !important;
color:black !important;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>
var bg_images = new Array('slide0bg.jpg','slide1bg.jpg','slide2bg.jpg','slide3bg.jpg');
var max_banners = bg_images.length;
var current_banner = 0;
var next_banner = 0;
var last_banner = max_banners-1;
var btimer = null;
$(document).ready(function(){
$('#banner>li').each(function(){
$(this).css('background-image','url('+bg_images[$(this).index()]+')');
$(this).css('z-index','-'+$(this).index());
});
make_buttons();
start_banner();
});
function start_banner()
{
if(max_banners>1)
{
next_banner = current_banner+1;
btimer = setInterval('rotate_banner()',5000);
}
}
function set_z_index()
{
var index = 0;
var cur_li = next_banner;
for(var i=0;i<max_banners;i++)
{
$('#banner>li').eq(cur_li).css('z-index',index);
cur_li++;
if(cur_li==max_banners) cur_li = 0;
index--;
}
}
function rotate_banner()
{
$('#banner>li').eq(next_banner).css('left','770px');
$('#banner>li').eq(next_banner).css('z-index','0');
if(max_banners>2)
$('#banner>li').eq(last_banner).css('z-index','-2');
$('#banner>li').eq(current_banner).css('z-index','-1');
$('#banner>li').eq(next_banner).animate({'left':'-=770px'},'slow');
$('#ban_nav_btn_'+current_banner).removeClass('banner_nav_current')
$('#ban_nav_btn_'+next_banner).addClass('banner_nav_current')
last_banner = current_banner;
current_banner = next_banner;
next_banner++;
if(next_banner==max_banners)
{
next_banner=0;
}
}
function make_buttons()
{
if(max_banners>1)
{
var n=1;
var add_nav = "<ul id='banner_nav'>";
for(var i=0; i<max_banners;i++)
{
add_nav+= "<li id='ban_nav_btn_"+i+"'";
if(i==0) add_nav+= " class='banner_nav_current'";
add_nav+= ">"+n+"</li>";
n++;
}
add_nav+= "</ul>";
$('#banner_container').append(add_nav);
}
}
</script>
</head>
<body>
<div id='banner_container'>
<ul id='banner'>
<li>
<div class='right_side_container'>
<div class='ad_box'>
</div>
<div class='ad_box'>
</div>
</div>
<div class='main_banner_text'>
It's Fall!
</div>
</li>
<li>
<div class='right_side_container'>
<div class='ad_box'>
</div>
<div class='ad_box'>
</div>
</div>
<div class='main_banner_text'>
It's Summer!
</div>
</li>
<li>
<div class='right_side_container'>
<div class='ad_box'>
</div>
<div class='ad_box'>
</div>
</div>
<div class='main_banner_text'>
It's Winter!
</div>
</li>
<li>
<div class='right_side_container'>
<div class='ad_box'>
</div>
<div class='ad_box'>
</div>
</div>
<div class='main_banner_text'>
It's Spring!
</div>
</li>
</ul>
<div>
</body>
</html>
Chris J
www.redash.org
|
|
|
|
|
Use firebug to check if there is really white space.
No more Mister Nice Guy... >: |
|
|
|
|
|
Here are two more screen shots that show my firebug window.
http://s5.postimage.org/z8zl234dj/fb_ss1.jpg[^]
http://s5.postimage.org/fsevfk99j/fb_ss2.jpg[^]
I also highlighted the ul in the first one and the li in the second. You can see the code dislayed in the window below which is odd as I did not have line breaks or tabs in my code, soI assume that fire bug is formating it. The generated source looks like this
<ul id="banner_nav"><li id="ban_nav_btn_0" onclick="selectFocus(0);" class="">1</li><li class="" id="ban_nav_btn_1" onclick="selectFocus(1);">2</li><li class="banner_nav_current" id="ban_nav_btn_2" onclick="selectFocus(2);">3</li><li class="" id="ban_nav_btn_3" onclick="selectFocus(3);">4</li></ul>
I do not see any whitespace, but it looks like a css issue with a height of 25px and padding 5px on the li. Firefox, Chrome and Safari do add this. the odd one is IE, but I think IE is correct (I could be wrong).
I had read online that making an element float forces a dislay block on the element which also adds spacing to the bottom, which is what I see here. But I also think that firefox and company are taking my 25px height and 25 px width, and adding the 5px padding to these along the y axis. I suspect that IE is respecting the 25px h+w and forcing the padding to stay with those limits....this is all just guess work on my part, so I am hoping the community has some advice.
I can run the code with the extra spacing, it does not stop it from working, but I would like it to truly look the same on all platforms.
ideas...?
Chris J
www.redash.org
|
|
|
|
|
|
I am running ie8 on an win xp box
Chris J
www.redash.org
|
|
|
|
|
|
That was my guess to.
Oh I am to late 
No more Mister Nice Guy... >: |
|
|
|
|
|
any website or mobile app which is created through this platform will ensure reaching to masses all over the world. HTML5 developers Do a great work and make your work easy far better.
|
|
|
|
|
I get an email whenever there's an error on my webapps. We recently initiated a service to do Red-Siren testing; e.g., testing for any security issues.
Got an error message today.
Of most interest, and danged funny at that, is the unedited, verbatim "Error Message" from Microsoft's lovely .NET Framework ... (emphasis added)
URL: https : / / www.RedactedWebSite.com /SomeWebApp/ThatLoginPage.aspx?ReturnUrl=%2fSomeWebApp%2fDefault.aspx%3faction%3dppr&action=ppr%3CScript%20%3Ealert(%22HelloSIG%22)%3C/Script%3E
Error Date: [redacted]
Error Message: A potentially dangerous Request.QueryString value was
detected from the client (action="ppr<Script >alert("Hell..."
Albeit a little late (going on 7+ years of .NET programming...), thanks for the warning Microsoft!
|
|
|
|
|
|
|
Hi, all
i am trying to print from a web application (server base) to a client's printer.
some one can help me how can i do that
i dont want to have print dialog nor want to convert to PDF neither i am using crystal report
|
|
|
|
|
in addition i am using VS 2005
|
|
|
|
|
The only way that you could do this would be to put something like an ActiveX control in place.
|
|
|
|
|
Hi all,
I have a mobile website.
When tested on a Samsung Star mobile and in Right-to-Left direction, text was displayed with bad format (un-wanted spaces and indents).
Samsung Star Browser: WAP 2.0/xHTML, HTML
http://www.gsmarena.com/samsung_s5230_star-2739.php
I've tried on some other mobiles but problem didn't occur.
Now, I don't know what is the problem, so I don't know how many other mobiles may problem occur on !!
There was another problem of screen width that does't occur on Samsung star but occurs on htc, and it has been fixed by adding a "HandheldFriendly" tag.
Please help me as soon as possible to fix that bad text format problem.
|
|
|
|
|
Hi all,
I have a mobile website.
When trying to send SMS via an SMS URL on htc mobile, I receive an "Invalid Recipient" error
but it works fine on other tested mobiles
sms url example:
<a href="sms:?body=TextText">Send By SMS</a>
<a href="sms:+123456789?body=TextText">Send By SMS</a>
Please help as soon as possible.
|
|
|
|
|
Hello guys;
I pop a dialog which contains two select (dropdownlist) controls. I use the first one to filter the second select.
My challenge is, whenever the second select width increases as a result of the data it contains, an horizontal scrollbar appears on the dialog which I don't want because, it disorganizes my form's appearance.
What do I need to do to auto-size the dialog's width as the width of the second select increases and shrinks as the case may be?
Thanking you guys in advance for the prompt response.
|
|
|
|
|
You can put the form in the div tag and set the horizontalscrollbar to true and verticalscrollbar to none.
|
|
|
|
|
Thank you for the response. It helped me.
|
|
|
|
|
Hey guys i need your guidance regarding building up a multilingual website.
Just as in facebook as we click on hindi all content get translated in hindi so i want to build a webpage like that,is it possible without google translate ???
if yes then how???
|
|
|
|
|
Yes, it's possible. You put your whole language stack in separate config files/database/whatever suits your fancy.
Then when your user clicks a certain language, you just extract those fields and replace within your website accordingly.
Also, Google[^] seems to be up and running today, and he may get you a much better explanation than I ever could. And guess what? 4th link is actually a CP article!
Full-fledged Java/.NET lover, full-fledged PHP hater.
Full-fledged Google/Microsoft lover, full-fledged Apple hater.
Full-fledged Skype lover, full-fledged YM hater.
|
|
|
|
|
|
Hi all,
I have a custom media type that can be handled by a plugin for IE. I listed my custom media type as application/x-roxd in the registry location
HKLM\Software\Microsoft\Windows\CurrentVersion\Internet Settings\Accepted Documents
While browsing, Internet Explorer 8 and below used to include this custom MIKE type in the list of accept types in the accept header. Upon receiving this, my server sends some binary data (application/x-roxd), which will in turn be processed by my C++ plugin that's loaded by IE, and the results are shown to the user.
However, IE9 and above won't send a properly complied list of accept types. It instead, sends */* (which means it can accept anything), as described in this IE Internals post: http://blogs.msdn.com/b/ieinternals/archive/2009/07/01/ie-and-the-accept-header.aspx[^] As such, the server isn't able to know if the plugin is installed and the chain of events break from that point as the server doesn't send the binary data back for processing.
They're suggesting that we don't list our MIME types there. I find this somewhat funny because Microsoft seem to list their own MIME types there (for excel, word, etc.,) and yet they're advising others not to do this.
My question now is: Is there a way for me to edit the accept header before it's sent out? All I need is to include application/x-roxd as an accepted MIME type.
Kindly let me know if any more information is required, and your help is highly appreciated.
"Real men drive manual transmission" - Rajesh.
modified 25-Sep-12 7:13am.
|
|
|
|
|
hello!
i'm newbie in ajax,php .i'm doing the following
1. connect to sql get hospitals name and display it
$con = mysql_connect("localhost","root","");
$address="nothing!";
$tel="nothing";
$desc="nothing";
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("trial", $con);
$q=mysql_query("select g_name from govermental_hos");
no problem with that.
2. display as dl
echo "<dl>";
while($row=mysql_fetch_array($q))
{
echo "<dt onclick=\"ajaxFunction()"\">";
echo $row['g_name']."</dt>";
}
echo"</dl>";
no problem with it
3. i want to give each id (would be variable)
then i wonna make onclick event so php will get info about the name clicked
function hos_info($g_name)
{
$query= mysql_query("select g_address,g_tel ,g_description from govermental_hos where g_name like '".$g_name."'");
if($row=mysql_fetch_array($query))
{ $address=$row['g_address'];
$tel=$row['g_tel'];
$desc=$row['g_description'];
echo $address;
}
}
the problem is
1.how can i access the clicked item via the java script
the script is
function ajaxFunction(){
var ajaxRequest;
try{
ajaxRequest = new XMLHttpRequest();
} catch (e){
try{
ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
alert("Your browser broke!");
return false;
}
}
}
}
ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
}
var g = "<?php echo $row['g_name']; ?>";
ajaxRequest.open("GET", "gov_fetch_data.php" + g, true);
ajaxRequest.send(null);
}
</script>
|
|
|
|
|
Not taking into consideration the issues in your code (lack of prepared statements, hardcoded DB connection values, etc.) you should do the following. I also you suggest you use jQuery instead of plain JS, it makes working asynchronously much easier and shorter:
Taking the id of an element using jQuery is pretty easy and straightforward,
you use the bind() function:
$('#button_id').bind('click', function(event) {
});
Then you submit your request to the server, also using jQuery:
$.ajax({
type: 'GET'
url: 'the_link_to_your_script.php',
data: {
request_param1_name: request_param1_value,
request_param2_name: request_param2_value,
},
success: function(data) {
},
error: function(data) {
}
);
Further reading you can find for bind()[^] and ajax()[^]
I also suggest you take a look at PHP prepared statements[^]
Full-fledged Java/.NET lover, full-fledged PHP hater.
Full-fledged Google/Microsoft lover, full-fledged Apple hater.
Full-fledged Skype lover, full-fledged YM hater.
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
