Welcome to the Java Programming Forums


The professional, friendly Java community. 21,500 members and growing!


The Java Programming Forums are a community of Java programmers from all around the World. Our members have a wide range of skills and they all have one thing in common: A passion to learn and code Java. We invite beginner Java programmers right through to Java professionals to post here and share your knowledge. Become a part of the community, help others, expand your knowledge of Java and enjoy talking with like minded people. Registration is quick and best of all free. We look forward to meeting you.


>> REGISTER NOW TO START POSTING


Members have full access to the forums. Advertisements are removed for registered users.

Results 1 to 4 of 4

Thread: My PHP/Java code causes the images to overlap. Why?

  1. #1
    Junior Member
    Join Date
    Jul 2014
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default My PHP/Java code causes the images to overlap. Why?

    I combine between Isotope and Jquery in addition to PHP, and for some reason something goes wrong and causes item elements to overlap.

    I tried solutions like Imagesloaded but i had no luck.

    Everything on the page seem to be arranged properly until i start to scroll down.

    This is a view for the result i get before scrolling down
    Untitled-2.jpg

    This is a view for the result i get after scrolling down
    Untitled-1.jpg

    This is the code, i appreciate your help.

    <?php
    $limit = 15;
    $page = (int) (!isset($_GET['p'])) ? 1 : $_GET['p'];
    # sql query
    $sql = "SELECT * FROM `table` ORDER BY `id` DESC";
    # find out query stat point
    $start = ($page * $limit) - $limit;
    # query for page navigation
    if( mysql_num_rows(mysql_query($sql)) > ($page * $limit) ){
    	$next = ++$page;
    }
    $query = mysql_query( $sql . " LIMIT {$start}, {$limit}");
    if (mysql_num_rows($query) < 1) {
    	header('HTTP/1.0 404 Not Found');
    	echo 'Page not found!';
    	exit();
    }
    ?>
     
    <html>
    <head>
    <title>My Title</title>
    	<link rel="stylesheet" "link/to/style.css">
     
    	<link rel="stylesheet" type="text/css" "link-to-Droid+Sans" />
     
    	<meta charset="UTF-8" />
    	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
     
    	<script src="link/to/jquery.min.js"></script>
    	<script type="text/javascript" src="link/to/jquery-1.9.1.min.js"></script>
    	<script type="text/javascript" src="link/to/isotope.pkgd.min.js"></script>
    </head>
    <body>
    <div id="container">
    	<?php while ($row = mysql_fetch_array($query)): ?>
     
    	<div class="item item-<?php echo $row['img_id']?>">
    		<?php
    		echo '<div class="ent_wrap">';
    			$image_file = '../uploads/previews/'.$row['img_name'].'-'.$row['img_id'].'.'.$row['img_ext'];
     
    			echo '<div class="preview_wrap">';
    				echo '<img src="'.$image_file.'" />';
    			echo '</div>';
    		echo '</div>';
    		?>	
    	</div>
     
    	<?php endwhile?>
     
    	<!--page navigation-->
    	<?php if (isset($next)): ?>
    	<div class="nav">
    		<a href='thisPage.php?p=<?php echo $next?>'>Next</a>
    	</div>
    	<?php endif?>
    </div>
     
    <script type="text/javascript" src="link/to/jquery-ias.min.js"></script>
    <script type="text/javascript" src="link/to/isotope.js"></script>
     
    <script type="text/javascript">
    	$(document).ready(function(){
    		var $container = $('#container');
     
    		$container.isotope({
    			filter: '*',
    			animationOptions: {
    				duration: 750,
    				easing: 'linear',
    				queue: false,
    			}
    		});
     
    		var page = 1;
     
    		$(document).ready(function() {
    			jQuery.ias({
    				container : '#container',
    				item: '.item',
    				pagination: '.nav',
    				next: '.nav a',
    				loader: 'Loading More Items. . .',
    				triggerPageThreshold: 3
    			});
    		});
    	});
    </script>
    </body>
    </html>
    Last edited by romangala; July 28th, 2014 at 10:47 PM.


  2. #2
    Administrator copeg's Avatar
    Join Date
    Oct 2009
    Location
    US
    Posts
    5,320
    Thanks
    181
    Thanked 833 Times in 772 Posts
    Blog Entries
    5

    Default Re: My PHP/Java code causes the images to overlap. Why?

    javascript != java, and this is a Java forum. Thread moved to Other Programming Languages.

  3. #3
    Super Moderator
    Join Date
    Jun 2013
    Location
    So. Maryland, USA
    Posts
    5,520
    My Mood
    Mellow
    Thanks
    215
    Thanked 698 Times in 680 Posts

    Default Re: My PHP/Java code causes the images to overlap. Why?

    Welcome to the forum! Thanks for taking the time to learn how to post code correctly. If you haven't already, please read this topic to learn other useful info for new members.

  4. #4
    Junior Member
    Join Date
    Jul 2014
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Re: My PHP/Java code causes the images to overlap. Why?

    Quote Originally Posted by copeg View Post
    javascript != java, and this is a Java forum. Thread moved to Other Programming Languages.

    Thank you sir, i apologize for any inconvenience i might caused. I'm aware that there is a difference between Java and Javascript. I posted my thread in the other forum because i could see a couple of web developing related threads posted there, that's all.

    --- Update ---

    Quote Originally Posted by GregBrannon View Post
    Welcome to the forum! Thanks for taking the time to learn how to post code correctly. If you haven't already, please read this topic to learn other useful info for new members.
    Thank you for taking the time to check my thread, I'm glad i made you happy by posting my code correctly.
    Last edited by romangala; July 29th, 2014 at 01:07 PM.

Similar Threads

  1. how can i apply ajax for this code with out usage of data base & php?
    By pragathi in forum Other Programming Languages
    Replies: 2
    Last Post: April 10th, 2014, 12:43 AM
  2. Replies: 0
    Last Post: May 23rd, 2013, 04:35 PM
  3. Help with method to check if two rectangles overlap
    By jikatz09 in forum What's Wrong With My Code?
    Replies: 4
    Last Post: March 20th, 2013, 06:19 AM
  4. how to convert this my PHP code 'send post request' to java
    By mr.msds in forum What's Wrong With My Code?
    Replies: 3
    Last Post: March 9th, 2013, 05:03 AM
  5. Why Graphics objects don't overlap.
    By SyntheticD in forum Java Theory & Questions
    Replies: 0
    Last Post: March 27th, 2011, 09:40 PM

Tags for this Thread