Προσπέλαση κώδικα

[nitrah]

Καλησπέρα σας ,

έχω κολλήσει και θέλω λίγη βοήθεια για να ξεκολλήσω

Λογικά είναι κάτι απλό απλά δεν μου έρχεται αυτή την στιγμή.

Θέλω να μου δώσει κάποιος μια ιδέα πως σε ένα File .html να μην φορτώσει συγκεκριμένο κομμάτι κώδικα αν δεν του πω εγώ(ο χρήστης στην ουσία) με κάποιο button ή κάτι τέτοιο.

 

Καμία ιδέα ?

[lionheart82]

Σε html? μήπως εννοεις σε php γιατι αυτο θέλει γλώσσα server side. Συνηθω αυτο γινεται με Get & Post requests... Πες μας τι ακριβώς θέλεις να κανεις να σου πούμε.

[nitrah]

Ναι σωστά ,

Τσεκ λίγο παρακάτω :

<section id="showcase">

<div class="container">

<div class="row wow fadeInDown" data-wow-duration="500ms">

<div class="col-lg-12">

 

<div class="title text-center">

<h2>Our <span class="color">Products</span></h2>

<div class="border"></div>

</div>

 

<div class="portfolio-filter clearfix">

<ul class="text-center">

<li><a href="javascript:void(0)" class="filter" data-filter="all">All</a></li>

   <li><a href="javascript:void(0)" class="filter" data-filter=".best">Δημοφιλή Προϊόντα</a></li>

<li><a href="javascript:void(0)" class="filter" data-filter=".sofa">Cat1</a></li>

<li><a href="javascript:void(0)" class="filter" data-filter=".armchairs">Cat2</a></li>

<li><a href="javascript:void(0)" class="filter" data-filter=".smalltables">Cat3</a></li>

</ul>

</div>

 

</div> <!-- /end col-lg-12 -->

</div> <!-- end row -->

</div> <!-- end container -->

 

και στην συνέχεια φορτώνει τις εικόνες

 

<div class="portfolio-item-wrapper wow fadeInUp" data-wow-duration="500ms">

                <ul id="og-grid" class="og-grid">

 

 

<li class="mix cat1">

<a href="javascript:void(0)" data-largesrc="img/portfolio/asdasd/pic1.jpg" data-title="Steven"  >

<img src="img/portfolio/asdasd/sofa1.jpg" alt="">

<div class="hover-mask">

<h3>Steven</h3>

<span>

<i class="fa fa-plus fa-2x"></i>

</span>

</div>

</a>

</li>

......

.......

.......

 

</ul> <!-- end og grid -->

</div>  <!-- portfolio items wrapper -->

 

</section>   <!-- End section -->

 

Όταν τρέχει η index.html φορτώνει ολες τις φωτογραφίες και ολες τις κατηγορίες.

Εγώ δεν θέλω να τις φορτώσει όλες αλλα π.χ. τις data-filter=".best" ή κάτι άλλο.

[Zaytsev]

Καλησπέρα σας ,

έχω κολλήσει και θέλω λίγη βοήθεια για να ξεκολλήσω

Λογικά είναι κάτι απλό απλά δεν μου έρχεται αυτή την στιγμή.

Θέλω να μου δώσει κάποιος μια ιδέα πως σε ένα File .html να μην φορτώσει συγκεκριμένο κομμάτι κώδικα αν δεν του πω εγώ(ο χρήστης στην ουσία) με κάποιο button ή κάτι τέτοιο.

 

Καμία ιδέα ?

Δεν έχεις δυνατότητα να κάνεις κάτι τέτοιο, αν η σελίδα δεν είναι δυναμική (php, asp, java, κλπ).

 

Αυτό που μπορείς να κάνεις, είναι το κουμπάκι να το έχεις κρυμμένο (style=:display:none;" ή ότι άλλο σε βολεύει) και να το εμφανίσεις κατά περίπτωση (πχ αν συμπληρώσει τα στοιχεία της φόρμας).

Ο πιό απλός τρόπος να το κάνεις είναι μέσω JQuery οπυ έχει και πάρα πολλά παραδείγματα στο site τους.

 

Σε αυτή την περίπτωση όμως, δεν έχεις καμία ασφάλεια, γιατί οποιοσδήποτε μπορεί να δει τον κώδικα html της σελίδας.

Άρα, συνίσταται μόνο για πρακτικούς λόγους, πχ όπως είπα, να εμφανίσεις ένα κουμπάκι, ή το επόμενο βήμα, ή όταν επιλέξει ο χρήστης έναν radio/check να του δείχνει κάτι.

[nitrah]

Με τον κώδικα που επισύναψα παραπάνω καμια ιδέα ;

[lionheart82]

Για να μην φορτώσει όλες τις εικόνες μπορείς να βάλεις ένα plugin javascript όπως το Lazy load. Εναλλακτικά θα μπορούσες να το κάνεις με javascript ... details tomorrow though

[nitrah]

Οταν λες details tomorrow through τι εννοείς ; επίσης το lazy τι ακριβώς κανει ;

[Predatorkill]

Μαλλον δε μπορουσε να σου απαντησει εκεινη τη στιγμη αναλυτικα.

 

To lazy load φορτωνει τις εικονες οσο ο χρηστης σκρολαρει (κυριως) τη σελιδα ωστε:

1. Να μην κανει πολυ ωρα να φορτωσει η σελιδα καθως αυτο φορτωνει τις εικονες σταδιακα

2. Μειωνεις κατα πολυ τα requests στον σερβερ καθως αλλος χρηστης μπορει να θελει να δει μονο μια-δυο φωτο (και μονο αυτες θα φορτωσουν απο τον σερβερ) και αλλος χρηστης μπορει να θελει να δει 10. Και οι δυο θα εχουν την ιδια εμπειρια χρησης οσον αφορα τη ταχυτητα.

[lionheart82]

Καλημέρα και απο εμένα, έχεις pm σχετικά. Εάν έχεις απορίες για τον κώδικα να το δούμε

[nitrah]

Μαλλον δε μπορουσε να σου απαντησει εκεινη τη στιγμη αναλυτικα.

 

To lazy load φορτωνει τις εικονες οσο ο χρηστης σκρολαρει (κυριως) τη σελιδα ωστε:

1. Να μην κανει πολυ ωρα να φορτωσει η σελιδα καθως αυτο φορτωνει τις εικονες σταδιακα

2. Μειωνεις κατα πολυ τα requests στον σερβερ καθως αλλος χρηστης μπορει να θελει να δει μονο μια-δυο φωτο (και μονο αυτες θα φορτωσουν απο τον σερβερ) και αλλος χρηστης μπορει να θελει να δει 10. Και οι δυο θα εχουν την ιδια εμπειρια χρησης οσον αφορα τη ταχυτητα.

Το έβαλα το Lazy αλλα δεν μου δούλέψε :/

Υπάρχει κάποια άλλη λύση ?

Τσεκ pm.

[Επισκέπτης]

Το κομμάτι του κώδικα που δεν θες να εκτελείται θα πρέπει να το βάλεις σε μια ρουτίνα JavaScript η οποία θα τρέχει όταν πατηθεί ένα κουμπί. Διαφορετικά δεν γίνεται, οτιδήποτε υπάρχει στον html κώδικα εμφανίζεται a priori στον browser.