This should be a really simple one, but just cant get it to work. I have a database with lets say 20 items. I am using php to echo each item. my code is :
echo "<li> <a class='bodylinks' href='http://domain.co.uk/fish/$txt2/'>$txt</a> </li>";
My problem is that my page only has height for say 14 of the items, however I have spare width. How to I make it move over to the right creating a new column when the height is maxed out on the other column? Hope this makes sense.
At the moment it just displays down to the 14 item then because I have overflow:hidden on the containing DIV it cuts the rest off.
you could use floats
try this, it will print out your list items horizontally from ltr (default direction) and drop to next line - vertically.
<li style="display:inline;"> contents </li>
alternatively, make your loop count 14 rows, then at 14th, close your UL/OL tag and create a new one like so:
<ul style="display:block; float:left;">
<?php
for($i = 0; $i = count($results); $i++) {
$txt = $results['txt']; // or however you do
$txt2 = $results['txt2']; // or however you do
if($i > 0 && $i % 14 == 0) echo '</ul><ul style="display:block; float:left;">';
echo "<li> <a class='bodylinks' href='http://domain.co.uk/fish/$txt2/'>$txt</a> </li>";
?>
</ul>
Related
I have an array of 34 logos. I would like to display them but I want to make a slider and have 6 logos on each slides.
I have difficulties to create the loop. My code is in Php but it's the logic who matters here I think. Here what I have done so far. I miss the loop in the middle.
$number_of_slides = round($logo_array, 0, PHP_ROUND_HALF_UP);
for($i ; $i < $number_of_slides ; $i++):
<div class="slide">
......
</div>
<?php endfor; ?>
Thanks for any help
If you already have your array split it into chunks:
$logo_array = [];
$chunks = array_chunk($logo_array, 6); // 6 is a size of chunk
foreach ($chunks as $chunk) {
// do dome stuff for each chunk, open some wrapper div or whatever
foreach ($chunk as $logo) {
// output current logo
}
// do dome stuff for each chunk, close some wrapper div or whatever
}
Or, if you want to do it in one loop, you could use some modulo logic:
$number_of_slides = 25;
$str='<div class="slide">';
for ($i=0 ; $i < $number_of_slides-1 ; $i++) {
$str.= $logo_array[$i].($i%6==5?"</div>\n<div class=\"slide\">":' ');
}
$str.=$logo_array[$i].'</div>';
echo $str; // output the whole string
A simplified demo can be found here: http://rextester.com/DVMPR99965
This not have any sense... your slider is in JS I presume? If it is, all logos would necessarily be into page and is your slider that will take care of the rest.
Some sliders have a specific verbose to separate the itens, others don't, just needing to set the max number of itens to be displayed into page.
What I would do? Well:
<div class="slide">
<?php
foreach($logo_array as logo){
echo "<img src='{$logo[src]}'>"; //or other tag pattern of your slider
}
?>
</div>
hi guys i am trying to do this like i have 5 frames (fancy border) and i have items list. when items load every item load different frame. when 5 frame done then 6th frame repeat frames list. below my script
<?php
$allgfts=mysql_query("select id,image_url from {$statement} order by id limit {$startpoint}, {$limit}");
while($gfts=mysql_fetch_array($allgfts))
{
$id=$gfts['id'];
$image=$gfts['image_url'];
?>
<div id="pic-1">
<div class="thumbnail-item">
<?php echo '<img src="images/'.$image.'" alt="" width="161" height="161" class="thumbnail g-size" />'; ?>
<span><?php echo 'Readmore';?></span>
<?php echo '<a class="gtbtn" href="g_buy.php?id='.$id.'">Get This</a>';?>
</div>
</div>
<?php
}
?>
I think you're asking how to echo a list of images, with that list wrapping to a new line every fifth item.
Given an array of results from a table (consider using PDO, by the way), I would do the following:
//$arr being the array
$x=1; //start counter
$list = '<ul>'; //using a list, because that's what it is
for($i=0;$i<count($arr);$i++) {
$list.='<li class="thumbnail-item">';
$thumb ='<a href="g_detail.php?id='.$arr[$i][id].'">';
$thumb.='<img src="images/'.$arr[$i][image_url].'" alt="" class="thumbnail g-size" /></a>';
$thumb.='<span><a href="g_detail.php?id='.$arr[$i][id].'>Readmore</a></span>';
$thumb.='<a class="gtbtn" href="g_buy.php?id='.$arr[$i][id].'">Get This</a>';
$list.=$thumb;
$list.='</li>';
if($x%5 == 0)||($x==count($arr)) {
$list.='</ul>';
if($x<count($arr)) {
$list.='<ul>';
}
}
$x++;
}
echo $list;
This is untested, but broadly speaking should work.
Use the remainder operator("%"). I don't know what your table structure looks like, but I am going to assume your product ID loads in sequential order, starting with 1.
In your WHILE loop, use the following:
$remainder = $id % 5;
if($remainder == 1){
//load my DIV with frame 1
}
else($remainder == 2){
//load my DIV with frame 2
}
......
Ok here is my new issue, and a complete description of what I am trying to accomplish. I used the suggestions you gave me and it worked fine, but when I changed the ORDER by information to a different field and the if statement, it went crazy.
Here is what I need, I have two columns on a page, when the array is processed I need it to display results filling each column left to right top to bottom. There is a division line between each item
<div class="centerBoxContentsFeatured centeredContent back vLine " style="width:50%;">
and one under each item
<div class="product-col" >.
If the item is the 3rd, 5th, 7th and so on… it will be on the left and does not need the “vLine “ div before it and if it is the last item(s) it does not need the “product-col” div under it as the last 2 items do not have to have the bottom divider, but if it is only two items on the whole page the bottom divider can stay. What am I doing wrong?
<?php
$count_temp = count ($productid);
for ($i = 0; $i < $count_temp; ++$i) {
$artist = get_the_title();
if (($productartist[$i] == $artist ) && $categoryID[$i] ==1 ) {
?>
//Content//
<?php if (!($i === 0) && !($i % 2) &&
($productid[$i] == 1) &&
( $i === (count ($productid) - 1))) {
echo'<div class="product-col-none" >';
}
else { echo '<div class="product-col" >';}
?>
//Content//
<? if !( $i === (count ($productid) - 1))
{
echo '<div class="centerBoxContentsFeatured centeredContent back vLine " '.
'style="width:50%;">';
}
else {
echo '<div class="centerBoxContentsFeatured centeredContent back " '.
'style="width:50%;">';}
?>
You should write here about your css file code, you are making things complicated and unclear with your html embedded php code.
If you just want a different style for your odd numbered (3,5,7..) items and a different style for your last item then I'll recommend to use css pseudo classes
You can use css pseudo class last-child for your last item.
li:last-child
{
// Your specific style for last item goes here
}
You can also use css pseudo class nth-child(odd) for alternating odd numbered items
li:nth-child(odd)
{
// Your specific style for odd items goes here
}
I hope this is what you are looking for, Why to give a server side load when you can set things done at client end.
hey guys , i know this is a stupid question but i hanged in solving it
i wrote a block of php code to show images from mysql
echo "<table><tr> ";
while($cat = $db->sql_fetchrow($catinfo)) {
echo '
<td>
<ul id="three-col" class="press">
<li>
<div class="post-content">
<a class="zoom1" href="'.$galsettings[setImgDir].'/'.$cat[galCatLocation].'/'.$cat[galCatImg].'">
<img src="'.$galsettings[setImgDir].'/'.$cat[galCatLocation].'/'.$cat[galCatImg].'" alt="artistry (via powerbooktrance)" />
</a>
</div>';
for ($i=0; $i>2; $i++) {
echo "</tr><tr>";
}
}
echo "</li></ul></td></tr></table>";
but with this code everything goes wrong and it doesnt break after each 3 images in row
i even used
if ($i>2) {
echo "</td></tr><tr>";
}
but as u know it only breaks the tr after image number 3 not every row
im really sorry for my foolish question
Try this:
echo "<table><tr> ";
$counter = 0;
while($cat = $db->sql_fetchrow($catinfo)) {
$counter++;
echo '
<td>
<ul id="three-col" class="press">
<li>
<div class="post-content">
<a class="zoom1" href="'.$galsettings[setImgDir].'/'.$cat[galCatLocation].'/'.$cat[galCatImg].'">
<img src="'.$galsettings[setImgDir].'/'.$cat[galCatLocation].'/'.$cat[galCatImg].'" alt="artistry (via powerbooktrance)" />
</a>
</div>
';
if ( $counter == 3 ) {
echo '</tr><tr>';
$counter = 0;
}
}
echo "</li></ul></td></tr></table>";
First off, the
for ($i=0; $i>2; $i++) {
should probably be
for ($i=0; $i < 2; $i++) {
There may be additional logic issues (looking)...
Indeed the logic seems utterly flawed, for ex. there doesn't appear to be anything which detects the the third image etc...
==> I suggest you try the snippet from tambler's answer. No point in trying and fix this one... but if you must:
the for ($i=0; $i>2; $i++) { loop is unnecessary. Even when fixed to $i < 2 (or 3...) this doesn't do anything useful.
with each new image you output a <td>, this needs to be closed with a </td>
there need to be a counter (the $i) you hint at in your snippet isn't valid
the counter is to be systematically incremented with each image
a test is to be added towards the end of the loop:
If counter >= 3 (or 2, if you make it 0-based)
reset counter;
emit ""
Also the <ul> and <li> and their respective closing tags are misplaced.
Where's you're </td> tag?
All your TDs have to be inside the TRs. You have to close the UL and TD before your TR.
So what I'm trying to do is select all the distinct months from my database and then print them in a list. That, I can accomplish. The problem lies in the fact that I need my list to be two column. The way that I achieve this with CSS is by using 2 different div's "left" and "right" which are floated next to each other. This poses a problem with PHP because it needs to echo a div close and a new div open after it echoes the sixth month. Then it needs to start again from where it left off and finish. I can't just list all of the months in the HTML, either because I don't want it to list a month if I don't have any records in the DB for that month, yet. Any ideas? I hope I was clear enough!
Thanks!
-williamg
Something like this should work (the basic idea being to just keep a count of the months an increment it as you loop through them):
<div class="left">
<?php
$x = 1;
foreach($months as $month) {
# switch to the right div on the 7th month
if ($x == 7) {
echo '</div><div class="right">';
}
echo "<div class=\"row\">{$month}</div>";
# increment x for each row
$x++;
}
</div>
<?php
$numberOfMonths = count($months);
$halfwayPoint = ceil($numberOfMonths / 2);
echo "<div class=\"left\">";
for($i=0; $i<$halfwayPoint; $i++){
echo $months[$i] . "<br />";
}
echo "</div><div class=\"right\">";
for($i=$halfwayPoint; $i<$numberOfMonths; $i++){
echo $months[$i] . "<br />";
}
echo "</div>";
?>
Rant: on
When displaying tabular data, use table instead of floating div. It will make sense when viewing the page with css disabled. If you use floated div, then you data will displayed all way down. Not all table usage is bad. People often hate table so much, so using floated div. Table only bad when used for page layout.
Rant: off
When I need to have certain content displayed with some open, close, and in-between extra character, I will make use of implode. This is the example:
$data = array('column 1', 'column 2');
$output = '<div>'.implode('</div><div>', $data).'</div>';
//result: <div>column 1</div><div>column 2</div>
You can extends this to almost anything. Array and implode is the power that php have for many years. You will never needed any if to check if it last element, then insert the closing character, or check if it first element, then insert opening character, or print the additional character between elements.
Hope this help.
Update:
My bad for misread the main problems asked. Sorry for the rant ;)
Here is my code to make a data displayed in 2 column:
//for example, I use array. This should be a result from database
$data = array(1, 2, 3, 4, 5, 6, 7, 8, 9);
//should be 12 month, but this case there are only 9 of it
for ( $i = 0; $i <= 5; $i++)
{
//here I do a half loop, since there a fixed number of data and the item for first column
$output = '<div class="left">'.$data[$i].'</div>';
if ( isset($data[$i+6] )
{
$output = '<div class="right">'.$data[$i+6].'</div>';
}
echo $output."\n";
}
//the result should be
//<div class="left">1</div><div class="right">7</div>
//<div class="left">2</div><div class="right">8</div>
//<div class="left">3</div><div class="right">9</div>
//<div class="left">4</div>
//<div class="left">5</div>
//<div class="left">6</div>
Other solution is using CSS to format the output, so you just put the div top to down, then the css make the parent container only fit the 6 item vertically, and put the rest to the right of existing content. I don't know much about it, since it usually provided by fellow css designer or my client.
Example assumes you have an array of objects.
<div style="width:150px; float:left;">
<ul>
<?php
$c = count($categories);
$s = ($c / 3); // change 3 to the number of columns you want to have.
$i=1;
foreach($categories as $category)
{
echo '<li>' . $category->CategoryLabel . '</a></li>';
if($i != 0 && $i % $s == 0)
{
?>
</ul>
</div>
<div style="width:150px; float:left;">
<ul>
<?php
}
$i++;
}
?>
</ul>
</div>