ویب پر گرفت اور تبدیل کرنے کے اوزار

جاوا اسکرپٹ کے ساتھ اسٹائل اسکرین شاٹس

جاوا اسکرپٹ API

GrabzIt کا جاوا اسکرپٹ API تمام تیار کردہ HTML عناصر کو CSS کے ساتھ اسٹائل کرنے کی اجازت دیتا ہے۔

انداز کی تصاویر

امیج اسکرین شاٹس کو اسٹائل کیا جاسکتا ہے displayid اور displayclass پیرامیٹرز یہ پیرامیٹرز متحرک طور پر تصویری آبجیکٹ میں ID یا کلاس انتساب انتیسٹی ولی کو متحرک کرتے ہیں۔ نیچے a CSS کلاس اسکرین شاٹ امیج کو تفویض کی گئی ہے۔

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
    {"displayclass": "MyClass"}).Create();
</script>
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertHTML("<html><body><h1>Hello World!</h1></body></html>",
    {"displayclass": "MyClass"}).Create();
</script>

سی ایس ایس کے بعد تصویر کو اسٹائل کرنے کے لئے مخصوص کیا جاسکتا ہے ، جیسا کہ ذیل میں دکھایا گیا ہے۔

<style>
.MyClass
{
    border:1px solid red;
}
</style>

ان اختیارات کو استعمال کرنے کا ایک اضافی فائدہ آپ کو جاوا اسکرپٹ کو اسکرین شاٹ کی تصویر میں ہیرا پھیری کے ل use استعمال کرنے کی بھی اجازت دیتا ہے۔ مخصوص ID کے نیچے تیار کردہ امیج اسکرین شاٹ کو تفویض کیا گیا ہے اور پھر اس کی وضاحت کی گئی ہے onfinish اسکرین شاٹ لوڈ ہونے کے بعد فنکشن کہتے ہیں۔ اس کے بعد یہ اسکرین شاٹ امیج حاصل کرنے کے لئے مخصوص آئی ڈی کا استعمال کرتا ہے اور اس کی قد کو ظاہر کرتا ہے۔

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
    {"displayid": "myScreenshot", "onfinish": function (id){
        var div = document.getElementById('myScreenshot');
        alert(div.height);
    }}).Create();
</script>
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertHTML("<html><body><h1>Hello World!</h1></body></html>",
    {"displayid": "myScreenshot", "onfinish": function (id){
        var div = document.getElementById('myScreenshot');
        alert(div.height);
    }}).Create();
</script>

انداز میں غلطی کے پیغامات

غلطی کے پیغامات کو اسٹائل کیا جاسکتا ہے errorid اور errorclass پیرامیٹرز یہ پیرامیٹرز متحرک طور پر آئی ڈی یا کلاس وصف خصوصا the غلطی پیغام میں شامل کرتے ہیں <span> عنصر ، جبکہ اضافی طور پر پہلے سے طے شدہ غلطی کا انداز ہٹاتے ہوئے۔

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
    {"errorclass": "MyErrorClass"}).Create();
</script>
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertHTML("<html><body><h1>Hello World!</h1></body></html>",
    {"errorclass": "MyErrorClass"}).Create();
</script>

غلطی کے پیغام کو پھر اسٹائل کیا جاسکتا ہے ، جیسا کہ ذیل میں دکھایا گیا ہے۔

<style>
.MyErrorClass
{
    font-weight:bold;
}
</style>

یقینا اگر اس کے ساتھ مل کر استعمال کیا جاتا ہے onerror واقعہ پھر غلطی کے پیغام کو جاوا اسکرپٹ کے ذریعہ بھی جوڑا جاسکتا ہے۔ نیچے a errorid اس کی وضاحت کی گئی ہے تاکہ خامی کے پیغام کی مدت کا حوالہ دیا جاسکے onerror تقریب اس فنکشن کے بعد غلطی کوڈ کو واپس کیا جاتا ہے تو غلطی کا پیغام تبدیل ہوجاتا ہے۔

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
    {"errorid": "myErrorMessage", "onerror": function (message, code){
        if (code == 500)
        {
            var span = document.getElementById('myErrorMessage');        
            if (span != null)
            {
                span.innerHTML = "Oops! We will get this sorted!";
            }
        }
    }}).Create();
</script>
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertHTML("<html><body><h1>Hello World!</h1></body></html>",
    {"errorid": "myErrorMessage", "onerror": function (message, code){
        if (code == 500)
        {
            var span = document.getElementById('myErrorMessage');        
            if (span != null)
            {
                span.innerHTML = "Oops! We will get this sorted!";
            }
        }
    }}).Create();
</script>